.map{width:100%;text-align:center;transition: all 350ms;}
.map1{height:670px;}
.map2{height:500px;}
.map .content-wrap{position:relative;height:100%}
.list{display:inline-block;width:80%;max-width:400px;position:absolute;right: 15px;top:50%;transform:translateY(-50%);}
.list li{position:relative;text-align:left;display:inline-block;width:100%;background:#fff;margin-bottom:20px;background: #FFFFFF;box-shadow: 0px 0px 10px 0px rgba(51, 51, 51, 0.1);box-sizing:border-box;padding: 20px 25px;}
.list li:last-child{margin-bottom:0;}
.list li h3{display:block;width:100%;font-size:22px;color:#333;margin-bottom: 20px;font-weight:bold}
.list li h4{font-size:18px;color:#666;}
.list li span{position:absolute;right: 20px;bottom: 12px;display:block;width:auto}
.list li span .iconfont{color:#fff;font-size: 16px;display:inline-block;padding:0;margin: 10px 8px;cursor:pointer;background:#f29100;width:24px;height:24px;text-align:center;line-height:24px;border-radius: 3px;}
.list li img{display:inline-block;margin-top:-88px;width:auto;height:auto;margin-bottom:5px;}
.list li p{font-size:18px;color:#666;margin:0;margin-top:15px;padding:0;line-height:24px;}

@media screen and (max-width: 1200px){
    .map{background-position:65% 0 !important}
}
@media screen and (max-width: 750px){
    .map{height:auto;background:#fff !important;}
    .list{position:static;transform: none;}
    .map2 .list{padding-top:80px;padding-bottom:50px}
}
@media screen and (max-width: 600px){
    .list li span{position:static;display:block;margin-top:15px;}
    .list li span .iconfont{margin-right:16px;margin-left:0;}
}