@charset "UTF-8";
/**
 * 
 * @authors Your Name (you@example.org)
 * @date    2016-07-29 09:06:11
 * @version $Id$
 */
body{
    background-color: #efeff4;
}
/*列表*/
.list_header{
    background:url(../../Resources/images/banner.jpg) no-repeat center center;
    background-size: cover;
    width:100vw;
    height: 32.258vw;
    min-height: 98px;
    position: relative;
}
.list_header .list_h_l{
    width:100%;
    position: absolute;
    top:50%;
    margin-top:-9.058vw;
}
.list_h_l>h1{
    width:25%;
}
.list_h_l>h1 img{
    display: inline-block;
    width: 18.116vw;
    height:18.116vw;  
    border-radius: 50%;
    -webkit-border-radius: 50%;
    border:3px solid rgba(200,200,200,0.6);
    margin-left:15px;
}
.list_h_l>div{
    margin-top:12px;
    width:55%;
}
.list_h_l>div>p{
    width:100%;
    text-overflow: ellipsis; overflow: hidden;white-space: nowrap; 
}
.list_h_l>div p:last-child{
    margin-top:5px;
    text-align: center;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    background-color: #666;
    opacity: 0.6;
    filter:alpha(opacity=60);
    width:100%;
}
.list_header .list_h_r{
    width:40%;
    text-align: right;
}
.list_h_r>h2{
    margin-left:30px;
}
.list_h_r>h2 img{
    width:20vw;
    height: auto;
    margin-right:20px;
}
.list_h_r>p{
    position: absolute;
    bottom:10px;
    right:20px;
}
.list_section,.list_article{
    background-color: #fff;
    margin-top:10px;
}
.list_column {
    margin-top:10px;
}
.list_section>p{
    font-size: 1.4rem;
    background:url(../../Resources/images/arrow_right.png) no-repeat 95% center;
    background-size: 2.013vw auto;
    padding:13px 0;
    border-bottom: 1px solid #f2f2f2;
}
.list_section>p i{
    display: inline-block;
    width:4.99vw; 
    height: 4.99vw; 
    background:url(../../Resources/images/total_img.png) no-repeat;
    background-size: 54.89vw;
    background-position: -4.99vw 0;
    vertical-align: middle;
    margin-left:20px;
    margin-right:10px;
}
.list_section>p em{
    vertical-align: middle;
}
.list_section>ul li{
    float: left;
    width:25%;
    text-align: center;
    padding:8px 0;
}
.list_section>ul li i{
    display: block;
    margin:2px auto;
    width:4.99vw; 
    height: 4.99vw; 
    background:url(../../Resources/images/total_img.png) no-repeat;
    background-size: 54.89vw;
}
.list_section>ul li.list_pay i{
    background-position: -9.98vw 0;
}
.list_section>ul li.list_goods i{
    background-position: 0 0;
}
.list_section>ul li.list_rated i{
    background-position: -19.96vw 0;
}
.list_section>ul li.list_retreat i{
    background-position: -24.95vw 0;
}
.list_article>p{
    font-size: 1.4rem;
    padding:13px 0;
    border-bottom: 1px solid #f2f2f2;
}
.list_article>p i{
    display: inline-block;
    width:4.99vw; 
    height: 4.99vw; 
    background:url(../../Resources/images/total_img.png) no-repeat;
    background-size: 54.89vw;
    background-position: -44.91vw 0;
    vertical-align: middle;
    margin-left:20px;
    margin-right:10px;
}
.list_article>p em{
    vertical-align: middle;
}
.list_article>ul li{
    width:33.3%;
    text-align: center;
    padding:8px 0;
}
.list_article>ul li span{
    display: block;
    color:#ff4965;
    margin-bottom: 2px;
}
.list_column{
    margin-bottom:20px;
}
.list_column>p{
    font-size: 1.4rem;
    background:url(../../Resources/images/arrow_right.png) no-repeat 95% center;
    background-size: 2.013vw auto;
    padding:13px 0;
    /*border-bottom: 1px solid #f2f2f2;*/
    background-color:#fff;
    margin-bottom:10px;
}
.list_column>p i{
    display: inline-block;
    width:4.99vw; 
    height: 4.99vw; 
    background:url(../../Resources/images/total_img.png) no-repeat;
    background-size: 54.89vw;
    vertical-align: middle;
    margin-left:20px;
    margin-right:10px;
}
.list_column>p.col_data i{
    background-position: -49.9vw 0;
}
.list_column>p.col_card i{
    background-position: -29.94vw 0;
}
.list_column>p.col_appoint i{
    background-position: -34.93vw 0;
}
.list_column>p.col_shop i{
    background-position: -39.92vw 0;
}
.list_column>p.col_service i{
    background-position: -14.97vw 0;
}
.list_column>p.col_collect i{
   
    background:url(../../Resources/images/collect.png) no-repeat;
    background-size: 4.99vw 4.99vw;
    vertical-align: middle;
}
.list_column>p em{
    vertical-align: middle;
}

/*九宫格*/
.grid_main{
    background-color: #fff;
    margin-top: 10px;
    margin-bottom:20px;
}
.grid_main ul li{
    float:left;
    width:25%;
    text-align: center;
    /*padding:12px 0;*/
    border-right:1px solid #f2f2f2;
    border-bottom: 1px solid #f2f2f2;
    box-sizing:border-box;
    -webkit-box-sizing:border-box; 
    height:24vw;
}
.grid_main ul li i{
    display: block;
    width:4.99vw; 
    height: 4.99vw; 
    background:url(../../Resources/images/total_img.png) no-repeat;
    background-size: 54.89vw;
    vertical-align: middle;
    margin:8px auto;
}
.grid_main ul li.grid_data i{
    background-position: -49.9vw 0;
}
.grid_main ul li.grid_card i{
    background-position: -29.94vw 0;
}
.grid_main ul li.grid_appoint i{
    background-position: -34.93vw 0;
}
.grid_main ul li.grid_shop i{
    background-position: -39.92vw 0;
}
.grid_main ul li.grid_service i{
    background-position: -14.97vw 0;
}
.grid_main ul li.grid_collect i{
    background:url(../../Resources/images/collect.png) no-repeat;
    background-size: 4.99vw 4.99vw;
    vertical-align: middle;
}
@media screen and (min-width: 375px){
    .list_section>p{ padding:14px 0;}
    .list_article>p{ padding:14px 0;}
    .list_column>p{ padding:14px 0;}
    .grid_main ul li{padding:16px 0;}
}
@media screen and (min-width: 414px) { 
    .list_section>p{ padding:15px 0;}
    .list_article>p{ padding:15px 0;}
    .list_column>p{ padding:15px 0;}
    /*.grid_main ul li{padding:22px 0;}*/
}