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

@import url("reset.css");

html { width:100%; height: 100%;}
html, body { margin:0; padding:0;}
body { font-family:"微軟正黑體",Arial, Helvetica, sans-serif; font-size:13px ; line-height:18px; color:#555; width:100%; letter-spacing:1px; -webkit-text-size-adjust: none; overflow-x: hidden; background:#FFF url(../images/bg.jpg) repeat-x left 50px;}
a{ text-decoration:none;}

header{ display:block; width:100%; height:100px; background: url(../images/header_bg.jpg) repeat-x; position:fixed; top:0; left:0; box-shadow: 0 0 20px rgba(0,0,0,0.5); z-index:99;}
header .main{ display:block; width:100%; height:100px; background:url(../images/header_bg2.jpg) no-repeat center bottom;}
header .main .content{ display:block; width:100%; max-width:1200px; margin:0 auto; position:relative;}
header .main .content a.logo{ display:block; width:235px; height:97px; background:url(../images/logo.png) no-repeat; text-indent:-5000px; position:absolute; top:3px; left:0;}
header .main .content nav{ display: inline-block; height:28px; position: absolute; top:54px; right:0;}
header .main .content nav ul{ display:inline-block; height:28px;}
header .main .content nav ul li{display:inline-block; height:28px;}
header .main .content nav a{ display:inline-block; height:28px; font-size:17px; line-height:28px; padding:0 23px; margin:0; color:#FFF; position:relative; background: url(../images/nav_bg.png) no-repeat right center;}
header .main .content nav a span{ display: none; width:100%; height:5px; border-radius:5px; background: #ffdc1d; position:absolute; left:0; bottom:-20px;}
header .main .content nav a span.hover{ display: none; width:10px; height:10px; margin:0 0 0 -5px; border-radius:10px; background: #ffdc1d; position:absolute; left:50%; bottom:-20px;}
header .main .content nav a.last{ background: none;}
header .main .content nav li.current a{ color:#ffdc1d;}
header .main .content nav li.current a span,header .main .content nav li.current a span.hover{ display: block;}

.banner{ display:block; width:100%; height:770px; margin:0 0 50px 0; overflow:hidden; position:relative;}
.banner .bg1{ display:block; width:100%; height:770px; overflow:hidden; position:relative;}
.banner .bg1 img.bg{ display: block; position:absolute; top:50px; left:-2694px;}
.banner .bg1 img.sky{
	animation-name: moveBanner1;  animation-duration:700s;  animation-iteration-count:infinite;  animation-timing-function:linear;
	-moz-animation-name: moveBanner1;  -moz-animation-duration:700s;  -moz-animation-iteration-count:infinite;  -moz-animation-timing-function:linear;
	-webkit-animation-name: moveBanner1;  -webkit-animation-duration:700s;  -webkit-animation-iteration-count:infinite;  -webkit-animation-timing-function:linear;
}
.banner .bg1 img.city{
	animation-name: moveBanner1;  animation-duration:300s;  animation-iteration-count:infinite;  animation-timing-function:linear;
	-moz-animation-name: moveBanner1;  -moz-animation-duration:300s;  -moz-animation-iteration-count:infinite;  -moz-animation-timing-function:linear;
	-webkit-animation-name: moveBanner1;  -webkit-animation-duration:300s;  -webkit-animation-iteration-count:infinite;  -webkit-animation-timing-function:linear;
}
.banner .bg1 img.road{
	animation-name: moveBanner1;  animation-duration:80s;  animation-iteration-count:infinite;  animation-timing-function:linear;
	-moz-animation-name: moveBanner1;  -moz-animation-duration:80s;  -moz-animation-iteration-count:infinite;  -moz-animation-timing-function:linear;
	-webkit-animation-name: moveBanner1;  -webkit-animation-duration:80s;  -webkit-animation-iteration-count:infinite;  -webkit-animation-timing-function:linear;
}

.banner .bg1 .mask{ display:block; width:100%; height:623px; background:url(../images/banner_mask.png) no-repeat; background-size:100% 623px; position:absolute; top:50px; left:0;}
.banner .bg1 .taxi{ display:block; width:926px; height:343px; margin:0 0 0 -463px; position:absolute; bottom:0; left:55%; opacity:0;}
.banner .bg1 .taxi{
	animation-name: moveTaxi1;  animation-duration:0.8s;  animation-iteration-count:infinite;  animation-timing-function:linear;
	-moz-animation-name: moveTaxi1;  -moz-animation-duration:0.8s;  -moz-animation-iteration-count:infinite;  -moz-animation-timing-function:linear;
	-webkit-animation-name: moveTaxi1;  -webkit-animation-duration:0.8s;  -webkit-animation-iteration-count:infinite;  -webkit-animation-timing-function:linear;
}
.banner .bg1 .taxi .wheel1{ display:block; width:124px; height:124px; position:absolute; top:190px; left:107px;transform: rotate(0deg);}
.banner .bg1 .taxi .wheel2{ display:block; width:124px; height:124px; position:absolute; top:190px; left:669px;transform: rotate(0deg);}
.banner .bg1 .taxi .wheel1,.banner .bg1 .taxi .wheel2{
	animation-name: movewheel;  animation-duration:1s;  animation-iteration-count:infinite;  animation-timing-function:linear;
	-moz-animation-name: movewheel;  -moz-animation-duration:1s;  -moz-animation-iteration-count:infinite;  -moz-animation-timing-function:linear;
	-webkit-animation-name: movewheel;  -webkit-animation-duration:1s;  -webkit-animation-iteration-count:infinite;  -webkit-animation-timing-function:linear;
}
.banner .bg1 .shadow{ display:block; width:926px; height:343px; margin:0 0 0 -463px; background:url(../images/banner_taxi_shadow.png) no-repeat; position:absolute; bottom:0; left:55%; opacity:0;}

.banner .slogen{ display:block; width:100%; position:absolute; top:200px; left:0; padding:50px 0 0 0; background:url(../images/slogen_en.png) no-repeat center top;}
.banner .slogen h1{ display:block; font-size:50px; line-height:65px; color:#FFF; text-align:center; letter-spacing:10px; font-weight: normal;}
.banner .slogen h1 span{ display:block; font-size:35px; font-weight: bold;}
.banner .slogen h1 span em{ display:inline-block; color:#ffdc1d; font-weight: bold; font-style: normal; padding:0 0 0 80px; background:url(../images/slogen_logo.png) no-repeat left center;}

h2{ display:block; margin:0 0 10px 0; padding:0 0 32px 0; font-size:33px; line-height:32px; font-weight:bolder; color:#0d0d0d; background:url(../images/h2_bg.png) no-repeat center bottom; text-align:center; letter-spacing:5px;}
h2 span{ display:block; font-size:14px; color:#aeaeae; font-weight: normal;}

.service{ display:block; width:90%; max-width:1200px; margin:0 auto 100px auto;}
.service p{ display:block; margin:0 0 35px 0; font-size:20px; line-height:28px; color:#0d0d0d; text-align:center; font-weight: bold;}
.service ul{ display: block; width:100%; overflow:hidden;}
.service ul li{ display:block; width:46%; height:205px; margin:0 2% 30px 2%; padding:23px 0 10px 0; float:left; background: #252525 url(../images/service_bg.jpg) no-repeat; border-radius:10px; background-size:100% auto;}
.service ul li .title{ display:block; width:100%; margin: 0 0 25px 0; padding:16px 0 0 95px; position:relative;}
.service ul li .title .number{ display:block; width:79px; height:72px; background:url(../images/service_icon.jpg) no-repeat; position:absolute; top:0; left:-3px;}
.service ul li .title .number span{ display:block; width:30px; height:30px; font-size:20px; line-height:30px; color:#161616; text-align:center; position:absolute; top:32px; left:40px; font-family:  Arial; font-weight: bold;}
.service ul li .title h3{ display:block; width:100%; font-size:25px; line-height:30px; color:#ffdc1d;}
.service ul li .title h3 span{ display:block; font-size:20px; color:#FFF; font-weight: normal;}
.service ul li .title h3 span a{ color:#FFF;}
.service ul li .title h3 span a:hover{ color:#FFF;}
.service ul li p{ display:block; width:95%; margin:0 auto; padding:15px 0; background:#FFF; border-radius:10px; font-size:17px; line-height:40px; color:#0d0d0d; text-align:center;}

.service ul li.width_long{ display:block; width:96%; height:205px; margin:0 2% 30px 2%; padding:23px 0 10px 0; float:left; background: #252525 url(../images/service_bg.jpg) no-repeat; border-radius:10px; background-size:100% auto;}
.service ul li.width_long .title{ display:block; width:100%; margin: 0 0 25px 0; padding:16px 0 0 95px; position:relative;}
.service ul li.width_long .title .number{ display:block; width:79px; height:72px; background:url(../images/service_auction.png) no-repeat; position:absolute; top:0; left:-3px;}
.service ul li.width_long .title .number span{ display:block; width:30px; height:30px; font-size:20px; line-height:30px; color:#161616; text-align:center; position:absolute; top:32px; left:40px; font-family:  Arial; font-weight: bold;}
.service ul li.width_long .title h3{ display:block; width:100%; font-size:25px; line-height:30px; color:#ffdc1d;}
.service ul li.width_long .title h3 span{ display:block; font-size:20px; color:#FFF; font-weight: normal;}
.service ul li.width_long .title h3 span a{ color:#FFF;}
.service ul li.width_long .title h3 span a:hover{ color:#FFF;}
.service ul li.width_long p{ display:block; width:95%; margin:0 auto; padding:15px 0; background:#FFF; border-radius:10px; font-size:17px; line-height:40px; color:#0d0d0d; text-align:center;}

.cars{ display:block; width:90%; max-width:1250px; margin:0 auto 100px auto;}
.cars p{ display:block; margin:0 0 35px 0; font-size:20px; line-height:28px; color:#0d0d0d; text-align:center; font-weight: bold;}
.cars ul{ display:block; width:100%; overflow:hidden; position:relative;}
.cars ul li{ display:block; width:33.3%; margin:0; float:left; position:relative; top:10px; opacity:0;}
.cars ul li p.title{ display:block; width:100%; height:50px; margin:0 0 20px 0; background: url(../images/cars_title_bg.png) no-repeat center 30px; position:relative; font-size:35px; line-height:23px; font-family: Calibri; font-style:italic; font-weight: normal; color:#575757; text-align:center; letter-spacing:2px;}
.cars ul li p.title em{ display:block; font-size:16px; color:#b7b7b7; font-weight: normal;}
.cars ul li p.title span{ display:block; width:17px; height:17px; border-radius:17px; background: #a6a6a6; position:absolute; top:22px; border:5px solid #FFF;}
.cars ul li p.title span.right{ display: block; right:0;}

.cars ul li.left p.title{ width:90%; left:10%;}
.cars ul li.left p.title span.right{ display: none;}
.cars ul li.right p.title{ width:90%;}
.cars ul li.right p.title span{ display: none;}
.cars ul li.right p.title span.right{ display: block;}

.cars ul li .img{ display:block; width:100%; position:relative;}
.cars ul li.left .img{ right:-5%;}
.cars ul li.right .img{ left:-5%;}
.cars ul li .img img{ width:100%; max-width:400px; height:auto; opacity:1;}
.cars ul li .img img.back{ width:100%; max-width:400px; height:auto; opacity:0; position:absolute; top:0; left:0;}



.driving{ display:block; width:100%; margin:0 auto 0 auto;}
.driving p{ display:block; width:100%; height:130px; margin:0 0 0 0; font-size:20px; line-height:28px; color:#0d0d0d; text-align:center; font-weight: bold; background:url(../images/driving_bg_top.png) no-repeat center bottom; background-size:100% 107px;}
.driving .main{ display:block; width:100%; padding:50px 0 0 0; background:#ffc21d url(../images/driving_bg_taxi.png) no-repeat right bottom; position:relative;}
.driving .main .people{ display:block; width:242px; height:212px; background:url(../images/driving_people.jpg) no-repeat; position:absolute; bottom:0; left:-126px; z-index:3;}
.driving .main .content{ display:block; width:100%; max-width:1200px; margin:0 auto; position:relative;}
.driving .main .content .people{ display:block; width:144px; height:212px; background:url(../images/driving_people.jpg) no-repeat; position:absolute; bottom:0; left:-144px; z-index:3;}
.driving .main ul{ display:block; width:100%; margin:0 auto; padding:0 0 0 40px; overflow:hidden; background:url(../images/driving_line2.png) no-repeat left bottom;}
.driving .main ul li{ display:block; width:25%; padding:0 0 40px 80px; font-size:17px; line-height:30px; color:#0c0c0c; float:left; background:url(../images/driving_line1.png) no-repeat left bottom; position:relative; z-index:2;}
.driving .main ul li .top{ display:block; width:100%; height:150px; background:#ffc21d; margin:0 0 0 -80px;}
.driving .main ul li .icon{ display:block; width:69px; padding:0 0 25px 0; position:absolute; top:0; left:0; background:#ffc21d url(../images/driving_line_icon.png) no-repeat center bottom;}
.driving .main ul li.bottom{ width:32%; margin:0 0 0 -10%; z-index:1;}
.driving .main ul li.bottom2{ width:26%; margin:0 0 0 0%; z-index:1;}
.driving .main ul li.top{ width:30%; margin:0 -15% 0 0; z-index:2;}
.driving .main ul li.bottom .icon,.driving .main ul li.bottom2 .icon{ top:150px;}
.driving .main ul li h3{ font-size:28px; margin:0 0 8px 0;}
.driving .main ul li span{ display:block; margin:5px 0 0 0; padding:0 0 8px 0; border-top:1px dotted #0c0c0c;}
.driving .main .text{ display:block; width:100%; max-width:1200px; height:194px; margin:0 auto; padding:25px 0 0 0; position:relative;}
.driving .main .text .icon{ display:block; width:233px; height:194px; padding:130px 0 0 0; background:url(../images/driving_line3.png) no-repeat; position:absolute; top:-15px; right:0; font-size:28px; line-height:35px; color:#0d0d0d;}
.driving .main .text p{ display:block; width: 100%; padding:0 130px 0 0; position:relative; z-index:3; background: none;}

.about{ display:block; width:100%;  margin:0 auto 30px auto; background:url(../images/about_bg.jpg) no-repeat left top; background-size: auto 100%;}
.about .top{display:block; width:100%; height:107px;background:url(../images/driving_bg_bottom.png) no-repeat center bottom; background-size:100% 107px;}
.about .main{ display:block; width:90%; max-width:1500px; margin:0 auto; overflow:hidden;} 
.about .main .right{ display:block; width:40%; margin:0 00% 0 0; padding:70px 0 200px 0; float:right;}
.about .main .right h2{ display:block; width:100%; padding:0 0 0 50px; font-size:32px; line-height:50px; color:#0d0d0d; text-align: left; background:url(../images/about_bg.png) no-repeat left center; letter-spacing:2px;}
.about .main .right p{ font-size:17px; line-height:31px; color:#0b0b0b;}
.about .main .right p strong{ display:block; font-size:19px; color:#b31717;}
.about .main a{ color:#0b0b0b;}
.about .main a:hover{ color:#0b0b0b;}

.contact{ display:block; width:95%; max-width:1200px; margin:0 auto 90px auto; overflow:hidden;}
.contact .left{ display:block; width:58%; padding:20px 0 0 0; float:left;}
.contact .left .part1{ display:block; width:100%; padding:0 0 60px 125px; position:relative; background:url(../images/contact_line.png) no-repeat 95px 10px;}
.contact .left .part1 .title{ display:block; width:125px; position:absolute; top:0; left:0; font-size:19px; line-height:30px; color:#0d0d0d; font-weight: bold;}
.contact .left .part1 h2{ display:block; width:100%; padding:0 0 0 50px; font-size:27px; line-height:30px; color:#0d0d0d; text-align:left; background: url(../images/about_bg.png) no-repeat left center;}
.contact .left .part1 h2 span{ display:inline-block; margin:0 0 -5px 10px; font-size:17px; letter-spacing:1px;}
.contact .left .part1 h3{ display:block; width:100%; margin:0 0 10px 0; padding:10px 0 0 0; border-top:1px solid #b2b2b2; font-size:19px; line-height:24px; color:#9b1d1d; text-align:center; letter-spacing:3px;}
.contact .left .part1 h3 span{ display:inline-block; padding:0 25px 0 0; background: url(../images/contact_point.png) no-repeat right center;}
.contact .left .part1 h3 span.last{ background: none; padding:0;}
.contact .left .part1 h3 span a{ color:#9b1d1d;}
.contact .left .part1 h3 span a:hover{ color:#9b1d1d;}
.contact .left .part1 ul{ display:block; width:100%; padding:10px 0 0 0; border-top:1px solid #b2b2b2; }
.contact .left .part1 ul li{ display:block; margin:0 0 10px 0; font-size:17px; line-height:25px; color:#0d0d0d;}
.contact .left .part1 ul li span{ color:#555;}
.contact .left .part1 ul li strong.remark{ display:inline-block; color:#e61c1c; padding: 0 2px; font-size:22px; vertical-align: middle;}
.contact .left .part1 ul li a{ color:#0d0d0d;}
.contact .left .part1 ul li a.tel{ font-size:27px; color:#a95b3c; vertical-align: middle;}
/*.contact .left .part1 ul li br{ display: none;}*/
.contact .left .part1 ul li span{ display: block; float:left; margin:0 0 15px 0;}
.fb_iframe_widget{vertical-align: text-top;display: inline-block !important;}
.fb_iframe_widget span{ margin:0 0 3px 0 !important;}
.contact .left .part1 ul li br{ display: block;}
.contact .left .part1 ul li{ clear: both;}

.contact .left .part2{ display:block; width:100%; padding:0 0 0 125px; position:relative; background:url(../images/contact_line.png) no-repeat 95px 10px;}
.contact .left .part2 .title{ display:block; width:90px; position:absolute; top:0; left:0; font-size:19px; line-height:30px; color:#0d0d0d; font-weight: bold;}
.contact .left .part2 p{ display:inline-block; font-size:15px; line-height:25px; color:#7a7a7a; vertical-align:top;}
.contact .left .part2 p strong{ color: #0d0d0d; padding:0 2px; font-size:19px; vertical-align: middle;}
.contact .left .part2 p span{ display: block; width:160px; height:25px; margin:0 0 10px 0; background: #2c2c2c; border-radius:25px; font-size:17px; line-height:25px; text-align:center; color:#FFF;}
.contact .left .part2 p.pright{ background:url(../images/contact_line.png) no-repeat left bottom; margin:0 0 0 20px; padding:0 0 0 30px;}

.contact .right{ display:block; width:42%; float: right;}
.contact .right img{ width:100%; max-width:494px; height:auto;}

.checked { color: orange;}

footer{ display:block; width:100%; padding:0 0 30px 0; background:#e7e7e7;}
footer .main{ display:block; width:90%; max-width:1200px; margin:0 auto; padding:25px 0 0 0; border-top:3px solid #272727; font-size:12px; line-height:21px; color:#0d0d0d; text-align:center; letter-spacing:3px;}
footer .main a{ color:#0d0d0d;}
footer .main a:hover{ color:#888;}
footer .main a.pagetop{ display:block; width:73px; height:100px; margin:30px auto 0 auto; background:url(../images/pagetop.png) no-repeat 0 0; cursor: pointer;}
footer .main a.pagetop:hover{ background-position:-73px 0;}


.animated {  -webkit-animation-duration: 1s; -moz-animation-duration: 1s;  animation-duration: 1s;  -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both;  animation-fill-mode: both;}
.animated2{  -webkit-animation-duration: .5s; -moz-animation-duration: .5s;  animation-duration: .5s;  -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both;  animation-fill-mode: both;}

.cars ul li.chover p.title em{ color:#ffc533;}
.cars ul li.chover p.title{ color:#0d0d0d}
.cars ul li.chover .img img.front{ opacity:0;}
.cars ul li.chover .img img.back { opacity:1;}
/*hover effect*/	
@media screen and (min-width: 1020px) {
	header .main .content nav a:hover{ color:#ffdc1d;}
	.cars ul li:hover p.title em{ color:#ffc533;}
	.cars ul li:hover p.title{ color:#0d0d0d}
	.cars ul li:hover .img img.front{ opacity:0;}
	.cars ul li:hover .img img.back { opacity:1;}
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
   /* IE10-specific styles go here */ 
}
@media screen and (max-width: 1800px) {
	.about{ background-size:auto 100%; background-position:0 }
	.about .main .right{  width:40%; margin:0 0% 0 0; padding:20px 0 189px 0; float:right;}
	}
@media screen and (max-width: 1500px) {
	.about{ background-size:auto 90%; background-position:0 40px}
	.about .main .right{  width:40%; margin:0 0% 0 0; padding:20px 0 150px 0; float:right;}
	}
@media screen and (max-width: 1400px) {
	.about{ background-size:auto 85%; background-position:0 40px}
	.about .main .right{  width:40%; margin:0 0% 0 0; padding:20px 0 150px 0; float:right;}
	}
@media screen and (max-width: 1300px) {
	
	.service ul li{  height: 220px;}
	.service ul li p{ line-height:25px;}
	.service ul li.width_long{  height: 220px;}
	.service ul li.width_long p{ line-height:25px;}
	.driving .main .text p{ padding:0 300px 0 20px; text-align: left;}
	.about{ background-size:auto 75%; background-position:0 50px}
	.contact .left .part2 p.pright{ background: none; margin:20px 0 0 0; padding:0;}
	.contact .left .part2 p br{ display: none;}
}
@media screen and (max-width: 1280px) {
	.service ul li{  height: 250px;}
	.service ul li p{ line-height:25px;}
	.service ul li.width_long{  height: 250px;}
	.service ul li.width_long p{ line-height:25px;}
	.about{ background-size:auto 75%; background-position:0 50px}
	.about .main .right{ padding:0 0 100px 0;}
}
@media screen and (max-width: 1150px) {
	.service ul li{  height: 250px;}
	.service ul li p{ line-height:25px;}
	.service ul li.width_long{  height: 250px;}
	.service ul li.width_long p{ line-height:25px;}
	.about{ background-size:auto 60%; background-position:0 50px}
	.about .main .right{ padding:0 0 100px 0;}
}

@media screen and (max-width: 960px) {
	body{ background-position: 0 -520px;}
	
	header{ top:-30px;}
	header .main .content a.logo{ width:150px; height:62px; background:url(../images/logo_m.png) no-repeat; top:38px; left:10px;}
	
	header .main .content nav{ display: none; background: rgba(10,10,10,0.95) url(../images/nav_bg_taxi.png) no-repeat right bottom; background-size: auto 300px; position:fixed; width:100%; height:100%; top:0; opacity:0;}
	header .main .content nav ul{ display:block; margin: 20% auto 0 auto;}
	header .main .content nav ul li{ display:block; width:50%; margin: 0 0 3% 0; text-align:center; float:left;}
	header .main .content nav a{ background: none; padding:0;}
	header .main .content nav a span{ bottom:-10px}
	header .main .content nav a span.hover{ bottom:-10px;}
	.navbtn{ display:block; width:30px; height:30px;  position:fixed; top:28px; right:28px; z-index:999;}
	.navbtn .line{ display:block; width:30px; height:2px; background:#FFF; position:absolute; top:5px; left:0;-webkit-transition:all 1s ease;  -moz-transition:all 1s ease;  -o-transition:all 1s ease;  -ms-transition:all 1s ease;  transition:all 1s ease; border-radius:2px;}
	.navbtn .line2{ display:block; width:30px; height:2px; background:#FFF; position:absolute; top:15px; left:0;-webkit-transition:all 1s ease;  -moz-transition:all 1s ease;  -o-transition:all 1s ease;  -ms-transition:all 1s ease;  transition:all 1s ease; border-radius:2px;}
	.navbtn .line3{ display:block; width:30px; height:2px; background:#FFF; position:absolute; top:25px; right:0;-webkit-transition:all 1s ease;  -moz-transition:all 1s ease;  -o-transition:all 1s ease;  -ms-transition:all 1s ease;  transition:all 1s ease; border-radius:2px;}
	
	.navbtn.open .line,.navbtn.open .line3{ top:15px; -webkit-transition:all 1s ease;  -moz-transition:all 1s ease;  -o-transition:all 1s ease;  -ms-transition:all 1s ease;  transition:all 1s ease;}
	
	.banner { margin:-300px 0 50px 0;}
	.banner .slogen{ top:400px;}
	.banner .slogen h1{ font-size:30px; line-height:40px;}
	.banner .slogen h1 span{ font-size:25px;}
	.banner .slogen h1 span em{ background-size: 45px auto; padding:0 0 0 50px;}
	.banner .bg1 .taxi{ width:100%; height:auto; margin:0; left:10%; background-size:100% auto;}
	.banner .bg1 .taxi img{ width:100%; height:auto;}
	.banner .bg1 .taxi .wheel1{ width:13.3%; height:auto; top:54%; left:11.5%;}
	.banner .bg1 .taxi .wheel2{ width:13.3%; height:auto; top:54%; left:72.2%;}
	.banner .bg1 .taxi .wheel1 img,.banner .bg1 .taxi .wheel2 img{ width:100%; height:auto;}
	.banner .bg1 .taxi .shadow{ left:10%;}

	.service ul li{  width:100%; height: auto; margin:0 auto 30px auto;}
	.service ul li p{ line-height:25px;}
	.service ul li.width_long{  width:100%; height: auto; margin:0 auto 30px auto;}
	.service ul li.width_long p{ line-height:25px;}
	.cars{ width:100%;}
	
	.driving p{ padding: 0 5% 140px 5%; background-size:auto 80px;}
	.driving .main ul{ width:90%; height:auto; margin:0 auto; padding:0; background: none;}
	.driving .main ul li{ width:100% !important; margin:0  0 20px 0 !important; background:url(../images/driving_line1_2.png) no-repeat 20px bottom;}
	.driving .main ul li .top{ display: none;}
	.driving .main ul li .icon{ top:0 !important; background: none; padding:0;}
	.driving .main .text .icon{ width:90%; height:70px; margin:0 auto 30px auto; padding:0 0 0 90px; background:url(../images/driving_line3_2.png) no-repeat; position:inherit; right:inherit;}
	.driving .main .text p{ width:90%; margin:0 auto; padding:0;}
	.driving .main .content .people{ top:-90px; left:30px; width:45px; height:73px; background: url(../images/driving_people.png) no-repeat;}
	
	.about{ margin:0 auto 50px auto; background:url(../images/about_bg2.png) no-repeat;  background-size: auto 370px; background-position:70% 0px;}
	.about .top{ height:80px; margin:0 0 280px 0; background-size: auto 80px;}
	.about .main .right{ width:100%; padding:0;}
	
	.contact .left{ width:100%;}
	.contact .left .part1{ padding:40px 0 30px 30px; background-position:0 0;}
	.contact .left .part1 h2{ background:url(../images/contact_bg.png) no-repeat left 4px;}
	.contact .left .part1 h2 span{ display: block; margin:0;}
	.contact .left .part1 h3{ line-height:25px;}
	.contact .left .part2{ padding:40px 0 30px 30px; background-position:0 0;}
	.contact .left .part1 .title,.contact .left .part2 .title{ left:30px;}
	.contact .left .part2 p.pright{ background: none; margin:20px 0 0 0; padding:0;}
	.contact .left .part2 p br{ display: none;}
	.contact .right{ width:100%; text-align:center;}
	
}
@media screen and (max-width: 480px) {

body{ background-position: 0 -220px;}
header{ top:-30px;}
header .main .content a.logo{ width:150px; height:62px; background:url(../images/logo_m.png) no-repeat; top:38px; left:10px;}
header .main .content nav ul{ display:block; margin: 30% auto 0 auto;}
header .main .content nav ul li{ display:block; width:100%; margin: 0 0 7% 0; text-align:center;}
.banner { top:-50px; height:500px; margin:0 0 0 0;}
.banner .slogen{ top:200px;}
.banner .slogen h1{ font-size:30px; line-height:40px;}
.banner .slogen h1 span{ font-size:25px;}
.banner .bg1{ height:500px;}
.banner .bg1 img.bg{ width:auto; height:380px;}
.banner .bg1 .mask{ height:350px; background-position:50% 0; background-size:120% 350px;}
.banner .bg1 .taxi{ width:100%; height:auto; margin:0; left:10%; background-size:100% auto;}
.banner .bg1 .taxi img{ width:100%; height:auto;}
.banner .bg1 .taxi .wheel1{ width:13.3%; height:auto; top:54%; left:11.5%;}
.banner .bg1 .taxi .wheel2{ width:13.3%; height:auto; top:54%; left:72.2%;}
.banner .bg1 .taxi .wheel1 img,.banner .bg1 .taxi .wheel2 img{ width:100%; height:auto;}

.banner .bg1 .shadow{ width:100%; height:343px; background-size:100% auto; margin:0; left:0; background-position: center bottom;}

.service ul li{  width:100%; height: auto; margin:0 auto 30px auto;}
.service ul li p{ line-height:25px; padding:15px 10px;}
.service ul li.width_long{  width:100%; height: auto; margin:0 auto 30px auto;}
.service ul li.width_long p{ line-height:25px; padding:15px 10px;}

.cars ul li{ width:100%; margin:0 auto 30px auto;}
.cars ul li.left,.cars ul li.right{ margin:0 auto 0px auto}
.cars ul li.left p.title{ width:100%; left:0%;}
.cars ul li.left p.title span.right{ display: block;}
.cars ul li.right p.title{ width:100%;}
.cars ul li.right p.title span{ display: block;}
.cars ul li.right p.title span.right{ display: block;}

.cars ul li.left .img{ right:0;}
.cars ul li.right .img{ left:0;}

.driving p{  padding: 0 5% 140px 5%; background-size:auto 80px;}
.driving .main ul{ width:90%; height:auto; margin:0 auto; padding:0; background: none;}
.driving .main ul li{ width:100% !important; margin:0  0 20px 0 !important; background:url(../images/driving_line1_2.png) no-repeat 20px bottom; font-size:19px; line-height:32px;}
.driving .main ul li .top{ display: none;}
.driving .main ul li .icon{ top:0 !important;}
.driving .main .text{ height:auto;}
.driving .main .text .icon{ width:90%; height:70px; margin:0 auto 30px auto; padding:0 0 0 90px; background:url(../images/driving_line3_2.png) no-repeat; position:inherit; right:inherit;}
.driving .main .text p{ width:90%;height:auto; margin:0 auto; padding:0 0 10px 0;}

.about{ margin:0 auto 20px auto;  background:url(../images/about_bg.jpg) no-repeat; background-size: auto 345px; background-position:0 15px;}
.about .top{ height:70px; margin:0 0 300px 0; background-size: auto 70px;}
.about .main .right{ width:100%; padding:0;}

.contact .left{ width:100%;}
.contact .left .part1{ padding:40px 0 30px 20px; background-position:0 0;}
.contact .left .part1 h2{ background:url(../images/about_bg.png) no-repeat left 4px;}
.contact .left .part1 h2 span{ display: block; margin:0;}
.contact .left .part1 h3{ line-height:25px;}
.contact .left .part2{ padding:40px 0 30px 20px; background-position:0 0;}
.contact .left .part1 .title,.contact .left .part2 .title{ left:20px; width:160px;}
.contact .left .part2 p.pright{ background: none; margin:20px 0 0 0; padding:0;}
.contact .left .part2 p br{ display: none;}
.contact .right{ width:100%;}
.contact .left .part1 ul li span{ display: block; float:left; margin:0 0 15px 0;}
.contact .left .part1 ul li br{ display: block;}
.contact .left .part1 ul li{ clear: both;}
.fb_iframe_widget_fluid{vertical-align: text-top; display: block !important; padding: 0 0 0 83px;}
}
@media screen and (max-width: 380px) {
	.about{ margin:0 auto 20px auto;  background:url(../images/about_bg.jpg) no-repeat; background-size: auto 305px; background-position:0 15px;}
	.about .top{ height:65px; margin:0 0 260px 0; background-size: auto 65px;}
	.about .main .right{ width:100%; padding:0;}
	
	
}

@media screen and (max-width: 320px) {
	.about{ margin:0 auto 20px auto;  background:url(../images/about_bg.jpg) no-repeat; background-size: auto 265px; background-position:0 15px;}
	.about .top{ height:65px; margin:0 0 220px 0; background-size: auto 65px;}
	.about .main .right{ width:100%; padding:0;}
	.contact .left .part1 ul li span{ display: block; float:left; margin:0 0 15px 0;}
	.contact .left .part1 ul li{ clear: both;}
}
@keyframes moveBanner1 {0%{ left:-2694px}  100%{ left:0;}}
@-moz-keyframes moveBanner1 {0%{ left:-2694px;}  100%{ left:0;}}
@-webkit-keyframes moveBanner1 {0%{ left:-2694px;}  100%{ left:0;}}

@keyframes moveTaxi1 {0%{ bottom:0;} 50%{ bottom:3px;} 100%{ bottom:0px;}}
@-moz-keyframes moveTaxi1 {0%{ bottom:0;} 50%{ bottom:3px;}  100%{ bottom:0px;}}
@-webkit-keyframes moveTaxi1 {0%{ bottom:0;} 50%{ bottom:3px;}  100%{ bottom:0px;}}

@keyframes movewheel { 0%{ transform: rotate(0deg);}  100%{ transform:rotate(-360deg)}}
@-moz-keyframes movewheel { 0%{ transform: rotate(0deg);}  100%{ transform:rotate(-360deg)}}
@-webkit-keyframes movewheel { 0%{ transform: rotate(0deg);}  100%{ transform:rotate(-360deg)}}


.active{-webkit-transition:all .5s ease;  -moz-transition:all .5s ease;  -o-transition:all .5s ease;  -ms-transition:all .5s ease;  transition:all .5s ease;}