@charset "utf-8";
html, body { width: 100%; height: 100%; }
html{background:#F5F5F5; }
body,h1,h2,h3,h4,h5,h6,blockquote,pre,dl,dd,fieldset,form,input,select,textarea,figure,div,form,img,ul,ol,li,i,b,table,tr,td,th,fieldset,label,legend{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}
body{font-size:12px;font-family:"Microsoft YaHei","Helvetica Neue","Hiragino Sans GB", "Segoe UI", Tahoma, Arial, STHeiti, sans-serif; _font-family:Tahoma,Arial,Helvetica,STHeiti,sans-serif;color:#333333;font-weight:normal;font-style:normal;}
ul,ol,menu{list-style:none;margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,a img,iframe{border:0 none;}
address,em,i{font-style:normal;}
input,select,button{vertical-align:middle;outline:0;}
input,textarea,select {*font-size:100%;outline:0;}
button {overflow: visible; }
a,img,a img{border:0px;}
a{text-decoration:none;cursor:pointer;transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;-webkit-transition:all 0.2s ease-in-out;-moztransition:all 0.2s ease-in-out; color:#333;}
a:hover{text-decoration:none; color:#4296d1;}
input.text,select.text,textarea.text{outline:none; border:1px solid #e3e3e3; height:26px; line-height:26px; padding:3px 0px 3px 5px;font-size:12px; color:#555;}
textarea{ outline:none; resize:none; border:1px solid #e3e3e3; font-size:12px;}
input.check{ vertical-align:middle; margin-right:2px;}
img{ vertical-align:top; -ms-interpolation-mode: bicubic; -moz-interpolation-mode: bicubic; -webkit-interpolation-mode: bicubic;/*图片缩放失真问题*/ transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; max-width:100%;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
ul li { list-style: none }
a { text-decoration: none; transition: all .1s linear; cursor: pointer; }
img { border: none }
.clear { clear: both }
.fl { float: left }
.fr { float: right }
.ellipsis { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }

/*banner广告*/
.flashBox {
    width: 100%;
    min-width: 1260px;
    margin-top: 18px;
    /*height: 657px;*/
    display: inline-block;
}

.swiper-container .swiper-wrapper .swiper-slide {
    width: 100%;
    height: 100%;
    margin: auto;
    /*position: relative;*/
}

.swiper-slide-1 {
    width: 100%;
    height: 100%;
    background-image: url("../images/banner_01.jpg");
    /*background-repeat: repeat-x;*/
}

.swiper-slide-2 {
    width: 100%;
    height: 100%;
    background-image: url("../images/banner_02.jpg");
    /*background-repeat: repeat-x;*/
}

.swiper-slide-3 {
    width: 100%;
    height: 100%;
    background-image: url("../images/banner_03.jpg");
    /*background-repeat: repeat-x;*/
}

.swiper-pagination-bullet {
    width: 21px;
    height: 21px;
    display: inline-block;
    border-radius: 100%;
    background: white;
    opacity: 0.3;
    -moz-opacity: 0.3;
    filter: alpha(opacity=30);
}

.swiper-pagination-bullet-active {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
}

.btt_header { z-index: 10; width: 100%; height: 84px; background-color: rgba(0,0,0,0.4); box-sizing: border-box; top: 0; position: fixed; transition: all .6s cubic-bezier(.215, .61, .355, 1) 0s; }
    .btt_header.active { box-shadow: 0 2px 6px rgba(0, 0, 0, .1); background-color: #fff; height: 84px; }
        .btt_header.active .nav_line > li { height: 84px !important; line-height: 84px; }
        .btt_header.active .nav_line li a { color: #212121; }
        .btt_header.active .nav_line li a i { display: inline-block; zoom: 1; width: 7px; height: 4px; background: url(../images/icon.png) 0 -280px no-repeat; overflow: hidden; margin: -2px 0 0 5px; vertical-align: middle; filter: alpha(opacity=50); opacity: 0.5; }

.btt_user_face span p { color: #fff; }
.btt_user_face.active span p{ color: #212121; }

.btt_header_top{
    width: 100%;
    height: 30px;
    background: #f4f4f4;
    color: #9F9F9E;
    font-size: 12px;
}

.btt_header_top .content{
    width: 100%;
    height: 30px;
    line-height: 30px;
    margin: 0 auto;
}

.btt_header_top .content ul{
    width: auto;
    height: 30px;
    float: right;
}

.btt_header_top .content ul li{
    width: auto;
    height: 30px;
    float: left;
}

.btt_header_top .content .desc{
    color: #FF6515;
}

.btt_header_box {
    width: 100%;
    height: 100%;
    clear: both;
    margin: 0 auto;
}

.btt_header_box .logo {
    height: 36px;
    width: 138px;
    float: left;
    margin-top: 26px;
    margin-left: 10px;
}

.btt_header_box .logo img {
    height: 36px;
    width: 138px;
}

.header_nav {
    height: 100%;
    float: left;
    display: inline-block;
}
.dropdown-menu > li > a { overflow: hidden; -webkit-transition: all .3s ease-out; transition: all .3s ease-out }
    .dropdown-menu > li > a:hover { background: #f2f2f2 none repeat scroll 0 0; text-indent: 5px; }
.dropdown-menu { background-color: #ffffff; border-color: #ffffff; }
    .dropdown-menu.dropdown-menu-bullet:after { border-bottom-color: #ffffff; }
    .dropdown-menu.dropdown-menu-bullet:before { border-bottom-color: #ffffff; }
.dropdown-item { border-radius: 0px; color: #2a333c !important; color: !important; -webkit-transition: all .25s ease-out; transition: all .25s ease-out; }
.dropdown-menu .border-top1 { border-top: 1px solid rgba(255,255,255,0.2); }

.dropdown-item { padding: .572rem 1.072rem; -webkit-transition: background-color .25s; -o-transition: background-color .25s; transition: background-color .25s; border-radius: .215rem }
    .dropdown-item .icon:first-child { width: 1em; margin-right: .5em; text-align: center }
.dropdown-divider { margin: 6px 0 }
.dropdown-menu { -webkit-transition: .25s; -o-transition: .25s; transition: .25s }
    .dropdown-menu.dropdown-menu-bullet { margin-top: 7px }
        .dropdown-menu.dropdown-menu-bullet:after, .dropdown-menu.dropdown-menu-bullet:before { position: absolute; left: 10px; display: inline-block; width: 0; height: 0; content: ''; border: 7px solid transparent; border-top-width: 0 }
        .dropdown-menu.dropdown-menu-bullet:before { top: -7px; border-bottom-color: #e4eaec }
        .dropdown-menu.dropdown-menu-bullet:after { top: -6px; border-bottom-color: #fff }
.dropdown-menu-right.dropdown-menu-bullet:after, .dropdown-menu-right.dropdown-menu-bullet:before { right: 10px; left: auto }

.nav_line {
    display: block;
    height:100%;
}

.nav_line li {
    display: block;
    float: left;
    height: 100%;
    margin: 0 5px;
    position: relative;
    font-size: 16px;
}

.nav_line li a {
    display: block;
    height: 84px;
    line-height: 84px;
    padding: 0 20px;
    color: #ffffff;
    font-size: 16px;
    box-sizing: border-box;
}

.nav_line .on a, .nav_line .active a {
    color: #09A1ED;
}
.overflow-visible { overflow: visible !important; }
.navbar-toggle { height: 60px; float: right }
.nav > li > a { color: #55acee; color:; }
.nav > li > a i { -webkit-transition: all .25s ease-out; transition: all .25s ease-out; }
.nav li .link.active:after { content: ''; width: 100%; background-color: #55acee; background-color:; left: 0; position: absolute; top: 0; height: 2px; z-index: -1 }
.nav > li > .link:after { content: ''; width: 0; background-color: #55acee; background-color:; left: 0; position: absolute; top: 0; height: 2px; z-index: -1 }
.nav > li > .link:hover:after { content: ''; width: 100%; background-color: #55acee; background-color:; left: 0; position: absolute; top: 0; height: 2px; z-index: -1 }
.nav > li > a:hover, .head_nav_met_11_4_1 .dropdown.open > a { color: #55acee !important; color: !important; background-color: transparent !important; }
.head_nav_met_11_4_1-login { padding-top: 15px; text-align: center }
.dropdown-toggle::after { display: inline-block; width: 0; height: 0; margin-left: .286rem; content: ''; vertical-align: middle; border-top: .286rem solid; border-right: .286rem solid transparent; border-left: .286rem solid transparent; }


.underline {
    position: absolute;
    width: 100%;
    height: 0;
    left: 0;
    bottom: 0;
    border-bottom: 2px solid #09A1ED;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: -webkit-transform .25s ease;
    transition: transform .25s ease;
}

.nav_line .on .underline, .nav_line .active .underline {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition: -webkit-transform .25s ease;
    transition: transform .25s ease;
}

.nav_line .hot {
    font-size: 12px;
    color: #ff4500;
    position: absolute;
    top: 10px;
    right: -5px;
}

.nav_line .btt_header_login a {
    border: 1px solid #ccd5db;
    box-sizing: border-box;
    cursor: pointer;
    margin-top: 10px;
    padding: 0 11px;
    width: 90px;
    text-align: center;
    height: 40px;
    line-height: 38px;
    border-radius: 3px;
}

.nav_line .btt_header_login a:hover {
    background: #09A1ED;
    border: 1px solid #09A1ED;
    color: #fff;
}

.nav_line .btt_header_register a {
    background: #09A1ED;
    color: #fff;
    border: 1px solid #09A1ED;
    box-sizing: border-box;
    cursor: pointer;
    margin-top: 10px;
    padding: 0 11px;
    width: 90px;
    text-align: center;
    height: 40px;
    line-height: 38px;
    border-radius: 3px;
}

.nav_line .btt_header_register a:hover {
    background: #09A1ED;
    border: 1px solid #09A1ED;
}
/*.banner { width: 100%; position: relative; }
.banner_main { width: 100%; height: 450px; position: relative; overflow: hidden; z-index: 10100; }*/

.header_button {
    height: 54px;
    float: right;
    margin-top: 28px;
}

.btn {
    /*width: 89px;
    height: 28px;*/
    border-radius: 24px;
    font-size: 12px;
    padding: 10px 18px;
    text-align: center;
    vertical-align: middle;
}

.register_default_hover_primary {
    color: #fff;
    border: 1px #3091F2 solid;
    background: #3091F2;
}

.register_default_hover_primary:hover {
    color: #fff;
    border: 1px #2976C9 solid;
    background: #2976C9;
}

.login_default_hover_primary {
    color: #3091F2;
    border: 1px #3091F2 solid;
}

.login_default_hover_primary:hover {
    color: #fff;
    border: 1px #3091F2 solid;
    background: #3091F2;
}

.margin_right_22px {
    margin-right: 22px;
}

.btt_header_has_login img{
    height: 40px;
    width: 40px;
    margin-top: 10px;
    border-radius: 20px;
}
.manage_menu{
    display: none;
    width: 120px;
    height: auto;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 61px;
    text-align: center;
    background-color: #fff;
    z-index: 1000;
    box-shadow: 2px 2px 20px rgba(0,0,0,.1);
}
.manage_menu a{
    display: block;
  
    font-size: 14px;
    cursor: pointer;
    color: #526069;
}
.manage_menu .btt_logout{
    background: #f3f3f3;
}
.manage_menu a:hover{
    background: #59c7f9;
    color: #fff;
}
.btt_user_face{
    cursor: pointer;float: left;width: 140px;padding-top: 10px; position: relative;
}
.btt_user_face img{
    float: left; margin:10px 0 0 20px;
}
/*公用头部与底部结束*/

.footer_box {
    width: 100%;
    height: auto;
    /*min-width: 1200px;*/
}

.footer_box .fast_navigation {
    width: 100%;
    height: 82px;
    background: #3C3C3C;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
}

.footer_box  .xian_box{width: 100%;height: 4px;}
.footer_box .footer_xian{width: 33%;height: 4px;float: left}
.footer_box .footer_xian:nth-child(3){background-color: #3288ff;}
.footer_box .footer_xian:nth-child(2){background-color: #f65131;width: 34%}
.footer_box .footer_xian:nth-child(1){background-color: #edad29;}
.footer_box .fast_navigation li {
    display: inline-block;
    line-height: 82px;
    color: #fff;
    margin: 0 28px;
    font-size: 18px;
}
.footer_box .fast_navigation a{
    color: #fff;
}

.footer_box .footer_info {
    width: 100%;
    height: auto;
    background: #333333;
    padding-top: 42px;
    padding-bottom: 20px;
    text-align: center;
}

.footer_box .footer_info .footer_info_container{
    width: 1080px;
    height: 180px;
    margin: 0 auto;
    background: #333333;
    display: inline-block;
}

.footer_info .left {
    width: 360px;
    height: 180px;
    display: inline-block;
}

.footer_info .left .rp {
    margin: 10px 0;
    font-size: 14px;
    color: #ffffff;
}

.lt {
    float: left;
}

.baottCopy {
    width: 100%;
    height: 60px;
    max-height: 60px;
    background: #333333;
    text-align: center;
    font-size: 14px;
    line-height: 60px;
    color: #fbfcff;
    min-width: 1260px;
    display: inline-block;
}


/*最新动态*/
.dynamic_list {
    width: 100%;
    height: auto;
    min-height: 400px;
    padding-top: 20px;
    background: #ffffff;
}

.dynamic_ul_css {
    width: 1200px;
    margin: 0px auto;
    padding: 0px;;
}

.dynamic_ul_css li {
    list-style: none;
    display: inline-block;
    vertical-align: top;
}

.dynamic_ul_css > li.first_li {
    background: white;
    border: 1px #f5f5f5 solid;
}

.dynamic_ul_css > li.first_li > a {
    width: 195px;
    height: 75px;
    line-height: 75px;
    text-align: center;
    font-size: 20px;
    cursor: pointer;
    display: block;
    background: white;
}

.dynamic_ul_css > li.first_li > a.active {
    background-color: #08A1EF;
    color: white;
}

.dynamic_ul_css > li.last_li {
    width: 905px;
    height: auto;
    margin-left: 50px;
    min-height: 300px;
    padding-left: 20px;
    display: inline-block;
}

.dynamic_ul_css > li.last_li > div {
    display: none;
}

.dynamic_ul_css > li.last_li > div.active {
    display: block;
}

.dynamic_ul_css > li.last_li .dynamic_system_css {
    width: 100%;
    height: auto;
}

.dynamic_ul_css > li.last_li .dynamic_system_css .dynamic_item {
    width: 100%;
    height: 215px;
    border-bottom: 1px #f5f5f5 solid;
}

.dynamic_ul_css > li.last_li .dynamic_system_css .dynamic_item img {
    width: 255px;
    height: 155px;
    margin-top: 30px;
    background: #f00;
    float: left;
}

.dynamic_item_info {
    width: 575px;
    height: 155px;
    margin-top: 30px;
    float: left;
    margin-left: 22px;
    color: #A6A6A6;
}

.dynamic_item_info .dynamic_item_info_name {
    width: 100%;
    height: auto;
    font-size: 22px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: #000;
}

.dynamic_item_info .dynamic_item_info_cont {
    width: 100%;
    height: 60px;
    line-height: 30px;
    margin: 20px 0;
    font-size: 16px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.dynamic_item_info .dynamic_item_info_date {
    width: 100%;
    height: auto;
    font-size: 14px;
}

/*模板商城*/
.shop_type_box {
    width: 100%;
    height: auto;
    background: #ffffff;
    display: inline-block;
}

.shop_type_box .type_tab_box {
    width: 1200px;
    height: 45px;
    line-height: 45px;
    margin: 20px auto;
}

.tab_item_nor {
    width: 110px;
    height: 45px;
    border-radius: 6px;
    border: 1px #08A1EF solid;
    margin-right: 10px;
    float: left;
    color: #08A1EF;
    text-align: center;
    font-size: 18px;
}

.tab_item_sel {
    width: 110px;
    height: 45px;
    border-radius: 6px;
    border: 1px #08A1EF solid;
    margin-right: 10px;
    background: #08A1EF;
    float: left;
    text-align: center;
    font-size: 18px;
    color: #ffffff;
}
.btt_mobile_view_main { height: 667px; background: #fff; width: 377px; position: absolute; left: 10px; top: 50px; }

    .btt_mobile_view_main .btt_mobile_header { height: 40px; width: 100%; background: #0099CC; color: #fff; line-height: 40px; }
.btt_mobile_header .iconfont { font-size: 20px; float: left; width: 20px; }
.btt_mobile_header .title { width: 357px; float: left; text-align: center; font-size: 16px; }
.btt_mobile_footer { height: 50px; width: 377px; background: #f2f2f2; }
    .btt_mobile_footer ul { width: 100%; height: 50px; background: #fff; border-bottom: 1px solid #f2f2f2; }
    .btt_mobile_footer li { float: left; text-align: center; width: 20%; }
        .btt_mobile_footer li .iconfont { display: block; line-height: 25px; font-size: 25px; margin-top: 5px; }
        .btt_mobile_footer li .text { height: 20px; line-height: 20px; font-size: 13px; }
.btt_mobile_page { height: 577px; width: 377px; overflow-y: scroll; background: #f2f2f2; }

    .btt_mobile_page::-webkit-scrollbar { /*滚动条整体样式*/ width: 2px; /*高宽分别对应横竖滚动条的尺寸*/ height: 4px; }
    .btt_mobile_page::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 1px; -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.2); background: rgba(0,0,0,0.2); }
    .btt_mobile_page::-webkit-scrollbar-track { /*滚动条里面轨道*/ -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.2); border-radius: 0; background: rgba(0,0,0,0.1); }

/*模板预览*/
.base_info_container { width: 1240px; height: 805px; margin: 85px auto; background: #fff; }

    .base_info_container .temlate_phone_icon { width: 348px; height: 720px; margin: 0 30px; float: left; margin-top: 40px; background: url(/public/home/image/holderphone.png) no-repeat 0 0; background-size: 100% 100%; -moz-background-size: 100% 100%; position: relative; }

    .base_info_container .temlate_info { width: 700px; height: 699px; padding-top: 40px; float: right; }

        .base_info_container .temlate_info .base_info_top { width: 100%; height: auto; overflow: hidden; padding-bottom: 10px; border-bottom: 1px #f5f5f5 solid; }

.base_info_top .temp_name { width: 100%; height: auto; font-size: 20px; color: #8a8a8a; margin-top: 45px; }

.base_info_top .temp_tags_container { width: 100%; height: auto; margin: 20px 0; display: inline-flex; }

    .base_info_top .temp_tags_container p { width: auto; padding: 10px 20px; border: 1px #f5f5f5 solid; float: left; margin-right: 10px; }

.base_info_top .pic_txt_container { width: 100%; height: auto; margin-top: 10px; margin-bottom: 10px; display: inline-block; }

    .base_info_top .pic_txt_container img { width: 20px; height: 20px; float: left; }

    .base_info_top .pic_txt_container p { float: left; font-size: 14px; margin-left: 10px; color: #8a8a8a; }

.base_info_bottom { width: 100%; height: auto; }

    .base_info_bottom .qrcode_container { width: 160px; height: 160px; border: 1px #f2f2f2 solid; margin: 22px 0; }

.temp_price { width: 100%; height: auto; color: #Ff0000; font-size: 26px; }

.temp_pay { width: 185px; height: auto; padding: 20px 0; color: #ffffff; font-size: 16px; text-align: center; border-radius: 5px; margin-top: 10px; background: #09A3FB; }

.template_list_box { width: 1240px; height: auto; margin: auto; }
.temlate_guess_title { width: 100%; margin-bottom: auto; padding-bottom: 15px; margin-top: 40px; text-align: center; display: inline-block; }

.temp_header_cont { width: auto; height: auto; display: inline-flex; }

.temlate_guess_title .temp_header_cont .line { width: 128px; height: 1px; background: #8a8a8a; margin-top: 20px; }

.temlate_guess_title .temp_header_cont span { line-height: 40px; margin: 0 20px; font-size: 24px; color: #0AA1F0; }


.shop_type_box .type_grid_box {
    width: 1160px;
    height: auto;
    padding: 10px 20px;
    border: 1px #f5f5f5 solid;
    margin: 0 auto;
    margin-bottom: 10px;
}

.shop_type_box .type_grid_box .type_nor {
    display: inline-block;
    margin: 10px;
    font-size: 14px;
}

.shop_type_box .type_grid_box .type_sel {
    display: inline-block;
    margin: 0 8px;
    font-size: 14px;
    color: #08A1EF;
}

.shop_type_box .shop_grid_box {
    width: 100%;
    height: auto;
    display: inline-block;
    margin-bottom: 50px;
}

.shop_grid_box ul {
    width: 1240px;
    margin: auto;
    padding: 0px;
    list-style-type: none;
}

.shop_grid_box ul li {
    float: left;
    margin-right: 26px;
    overflow: hidden;
    margin-top: 40px;
    position: relative;

}

.shop_grid_box ul li .name_price{
    position: absolute;
    left: 0;
    bottom: 0;
    height: 30px;
    background: rgba(0,0,0,.6);
    z-index: 100;
    width: 100%;
    color: #fff;
    line-height: 30px;
}


.shop_grid_box  img {
    width: 222px;
    height: 395px;
}


/*底部分页区域*/
#page{margin: 0 auto; width: 60%; text-align: center;height: 50px; margin-top: 10px;}
.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 0 auto;
    border-radius: 4px;

}
.pagination li {
    float: left;
    margin-left: 5px;
}
.pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 10px 16px;
    margin-left: -1px;
    font-size: 14px;
    text-decoration: none;
    background-color: #e3e3e3;
    border: 1px solid #f2f2f2;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 2;
    cursor: default;
    color: #000;
    background-color: #f5f5f5;
    border-color: #f5f5f5;
}

.end-link-box{
    width: 100%;
    height:auto;
    background: #333333;
    padding-bottom: 20px;
}

.end-link{
    width: 100%;
    height: auto;
    background: #333333;
    min-width: 1140px;
    margin: 0 auto;
    font-size: 14px;
    color: #fbfcff;
    max-width: 1140px;
    min-width: 1140px;
    line-height: 25px;
    color: #8b8b8b;
    border: 1px dashed #bbb6b6;
}

.end-link span{
    width: auto;
    height:auto;
}

.end-link a {
    width: auto;
    height:auto;
    color: #8b8b8b;
}
.ml20 {
    margin-left: 20px;
}

.fb {
    font-weight: bold;
}

/*悬浮框样式*/
.consultationList{z-index: 6;position: fixed;top: 50%;right: 2px;margin-top: -179px;  }
.consultationList ul {width:69px;}
.consultationList li {position:relative;float:right;width:69px;height:69px;margin-bottom:2px;font-size:0px;text-align:center;}
.consultationList li.openLi {overflow:hidden;-moz-transition: all .5s; -webkit-transition: all .5s;-o-transition: all .5s;transition: all .5s;}
.consultationList li.openLi a {width:190px;display:inline-block;vertical-align:top;}
.consultationList li span {float:left;width:69px;line-height:15px;display:inline-block;vertical-align:top;}
.consultationList li span.s2 {width:120px;height:69px;font-size:14px;line-height:69px;}
.consultationList li:hover span.s2 {margin-left:-20px;}
.consultationList li div {position:absolute;top:-47px;left:-182px;width:160px;height:160px;padding:5px;display:none;background:#fff;box-shadow:0 0 10px #09A1ED;border:1px solid #09A1ED;}
.consultationList li div img {width:150px;height:150px;}
.consultationList li p {font-size:12px;line-height:15px;}
.consultationList li a {color:#fff;}
.consultationList li .icon {width:32px;height:32px;margin-top:11px;margin-bottom:5px;display:inline-block;vertical-align:top;}
.consultationList li.l1 {background:#7be488;}
.consultationList li.l2 {background:#7be0e4;}
.consultationList li.l3 {background:#f1ca80;}
.consultationList li.l4 {background:#8cc3f1;}
.consultationList li.l5 {background:#FF8D6E;}
.consultationList li.l6 {background:#71CAF4;}
.consultationList li.l6  i{background:none;}
.consultationList li.l1 i {background-position:-702px -10px;}
.consultationList li.l2 i {background-position:-738px -10px;}
.consultationList li.l3 i {background-position:-777px -10px;}
.consultationList li.l4 i {background-position:-815px -10px;}
.consultationList li.l5 i {background-position:-852px -10px;}
.consultationList li:hover{ width: 170px; background:#09A1ED;}
.consultationList li:hover div{display: inline-block;}


.list { width: 220px; display: inline-block; padding: 2px 0px 2px 2px; position: relative; margin-bottom: 20px; }
.img-bj { background-image: url(../images/iphone0.png); background-repeat: no-repeat; background-size: 100% 100%; height: 440px; width: 220px; position: relative; }
.img-centent { width: 90%; height: 76.5%; position: absolute; top: 41px; left: 11px; background-repeat: no-repeat; background-size: 100% 100%; }
.input { width: 100%; margin: 0 auto; text-align: center; padding: 3px; margin-top: 15px; border-radius: 4px; font-size: 14px; }
.list-mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(114, 114, 114, 0.52); display: none; border-radius: 4px; border: 2px solid #d8d8d8; }
.list-mask a { text-decoration: none; color: #fff; padding: 5px; border: 2px solid #fff; border-radius: 2px; display: block; width: 40%; text-align: center; margin: 95% auto; }
a { text-decoration: none; transition: all .1s linear; cursor: pointer; }
.list:hover .list-mask { display: block; }