@charset "utf-8";
/* CSS Document */

#marketing{margin:0 auto; background:#fff;padding:120px 0;}
#marketing>.title{ position:relative; width:86%; max-width:1300px; margin:0 auto; font-size: 30px;color: #333; text-align:center;font-weight: 600;}
#marketing>.title:after{position:absolute;z-index:3;left:50%;bottom:-10px; margin-left:-25px; width:50px;height:2px; background:#026ab5;content:'';}
#marketing>.container{position:relative;width:970px;margin:0 auto;}
#marketing>.container>.map{margin:30px auto;}
#marketing>.container>.map>img{width:100%;height:auto;}

#marketing>.region{margin:0 auto; width:86%; max-width:1000px;padding:20px 0;}
/*
#marketing>.region>.item{width:31.33%; position:relative; float:left; margin-right:3%; margin-top:3%; box-sizing:border-box; border:1px solid #eee; border-radius:5px;padding:20px 0;overflow:hidden; text-align:left; transition:all .35s;}
#marketing>.region>.item:nth-child(3n){margin-right:0 !important;}*/
#marketing>.region>.item{width:49%; position:relative; float:left; margin-top:3%; box-sizing:border-box; border:1px solid #eee; border-radius:5px;padding:20px 0;overflow:hidden; text-align:left; transition:all .35s;}
#marketing>.region>.item:nth-child(even){float:right;}
#marketing>.region>.item strong{ display:none; position:absolute;z-index:4;left:0;top:0;padding:5px 10px; font-size:12px;border-radius:0 0 5px 0; color:#fff; background:#1c73c5;}
#marketing>.region>.item span{display:block; text-align:left; box-sizing:border-box; padding-left:70px; width:100%; font-size:15px; color:#333;}
#marketing>.region>.item:hover{border:1px solid #44a8fc; box-shadow:0 0 10px rgba(0,0,0,.1);}
#marketing>.region>.item:hover strong{ background:#44a8fc;}


@media only screen and (max-width: 1020px){
  #marketing>.region>.item span{ font-size:14px;}

}


@media only screen and (max-width: 980px){
  #marketing>.container{width:86%;}
  #marketing>.region>.item{width:49%; margin-right:0;}
  #marketing>.region>.item:nth-child(even){float:right;}

}
@media only screen and (max-width: 740px){
	#marketing>.region>.item span{padding-left:40px;}
}
@media only screen and (max-width: 640px){
  #marketing{padding:60px 0;}
  #marketing>.title{font-size:20px;}
  #marketing>.container>.outlets>ul>li:after{width:6px;height:6px;}
  #marketing>.region{width:72%;}
  #marketing>.region>.item{width:100%; float:none!important;}  
  #marketing>.region>.item span{padding-left:20px; font-size:14px;}
  
}


#case{margin:0 auto;padding:120px 0;}
#case>.title{ position:relative; width:86%; max-width:1300px; margin:0 auto; font-size: 30px;color: #333; text-align:center;font-weight: 600;}
#case>.title:after{position:absolute;z-index:3;left:50%;bottom:-10px; margin-left:-25px; width:50px;height:2px; background:#026ab5;content:'';}
#case>.container{position:relative;width:86%;max-width:1300px;margin:0 auto;padding:40px 0;}
#case>.container>.img{text-align:left;}
#case>.container>.img>img{width:100%;height:auto;}
#case>.container>.content{margin:0 auto;}
#case>.container>.content>ul{margin:0 auto;padding:20px 0;}
#case>.container>.content>ul>li{ position:relative; display:block;float:left;width:25%; overflow: hidden;text-overflow:ellipsis; white-space: nowrap; box-sizing:border-box;padding:10px 60px 10px 20px; color:#666; text-align:left;font-size:16px;}
#case>.container>.content>ul>li:after{position:absolute;z-index:4;left:0;top:50%; margin-top:-4px; width:8px;height:8px;background:#ddd; border-radius:100%; content:'';}


@media only screen and (max-width: 800px){
  #case>.container>.content>ul>li{ float:left;width:50%;}

}
@media only screen and (max-width: 640px){
  #case{padding:60px 0;}
  #case>.title{font-size:20px;}
}
@media only screen and (max-width: 420px){
  #case>.container>.content>ul>li{ float:none;width:100%;padding:5px 20px;}

}