以下是 蚂蜂窝官网jQ焦点图轮播滚动切换特效代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>蚂蜂窝官网jQuery焦点图</title>
<script language="javascript" src="js/jquery-1.4.4.min.js" type="text/javascript"></script>
<link href="css/zzsc.css" rel="stylesheet" type="text/css" />
<script language="javascript" src="js/m.index.js" type="text/javascript"></script>
</head>
<body>
<div id="header">
<div class="mfw_main">
<div class="content">
<div class="focus">
<div class="slide">
<div class="play">
<ul id="pnl_scroll">
<li><a href="#" target="_blank">
<img height="350" width="565" src="img/wKgB3FGQyTiAeqAEAAFRtgkR-7g72.jpeg"></a>
<div class="info">
图片来自于<font color="#FF9900">川藏线</font>,此目的地共收藏了<font color="#FF9900">121270</font>张<a href="/travel-scenic-spot/mafengwo/10517.html" target="_blank">川藏线</font>图片。本片由<font color="#FF9900">天空之城</font>荣誉出品!</div>
</li>
<li><a href="#" target="_blank">
<img height="350" width="565" src="img/wKgB3FGR1BKAc2VwAAGEJQW_WEQ85.jpeg"></a>
<div class="info">
图片来自于<font color="#FF9900">无锡</font>,此目的地共收藏了<font color="#FF9900">43229</font>张<a href="/travel-scenic-spot/mafengwo/10140.html" target="_blank">无锡</font>图片。本片由<font color="#FF9900">瞎鼓捣</font>荣誉出品!</div>
</li>
<li><a href="#" target="_blank">
<img height="350" width="565" src="img/wKgB3FGTaRiAcz2eAAHSmlouRZw57.jpeg"></a>
<div class="info">
图片来自于<font color="#FF9900">意大利</font>,此目的地共收藏了<font color="#FF9900">48433</font>张意大利</font>图片。本片由<font color="#FF9900">小小苏子木花花菜</font>荣誉出品!</div>
</li>
<li><a href="#" target="_blank">
<img height="350" width="565" src="img/wKgB3FGTZ6SAcLg5AAG4LbVzdco65.jpeg"></a>
<div class="info">
图片来自于<font color="#FF9900">云南</font>,此目的地共收藏了<font color="#FF9900">543861</font>张云南</font>图片。本片由<font color="#FF9900">越林帆</font>荣誉出品!</div>
</li>
<li><a href="#" target="_blank">
<img height="350" width="565" src="img/wKgB3FGR5NOAAiYwAAKlG5Dnu1873.jpeg"></a>
<div class="info">
图片来自于<font color="#FF9900">吴哥窟</font>,此目的地共收藏了<font color="#FF9900">129114</font>张吴哥窟</font>图片。本片由<font color="#FF9900"></font>荣誉出品!</div>
</li>
</ul>
</div>
<div class="tab">
<ul id="pnl_btn">
<li>
<a href="javascript:void(0);" onclick class="on">
<img src="img/wKgB3FGQyTiAeqAEAAFRtgkR-7g72.index.w108.jpeg"></a></li>
<li>
<a href="javascript:void(0);" onclick class="on">
<img src="img/wKgB3FGR1BKAc2VwAAGEJQW_WEQ85.index.w108.jpeg"></a></li>
<li>
<a href="javascript:void(0);" onclick class="on">
<img src="img/wKgB3FGTaRiAcz2eAAHSmlouRZw57.index.w108.jpeg"></a></li>
<li>
<a href="javascript:void(0);" onclick class="on">
<img src="img/wKgB3FGTZ6SAcLg5AAG4LbVzdco65.index.w108.jpeg"></a></li>
<li>
<a href="javascript:void(0);" onclick class="on">
<img src="img/wKgB3FGR5NOAAiYwAAKlG5Dnu1873.index.w108.jpeg"></a></li>
</ul>
</div>
</div>
</div>
<!-- focus end --></div>
</div>
</div>
</body>
</html>
JS代码(m.index.js):
//auto scrollvar cfg={
"scroll":500,//滚动时间 "stop":3000,//停留时间 "num":5//图片数}
;
function run(){
if(parseInt($("#pnl_scroll").css("left"))>-(565*(cfg.num-1))){
run.index++;
$("#pnl_scroll").animate({
left:'-=565px'}
,cfg.scroll,function(){
$("#pnl_btn li.on").removeClass("on");
$("#pnl_btn li").eq(run.index).addClass("on");
start_auto();
}
);
}
else{
run.index=0;
$("#pnl_scroll").animate({
left:'0px'}
,cfg.scroll,function(){
$("#pnl_btn li.on").removeClass("on");
$("#pnl_btn li").eq(run.index).addClass("on");
start_auto();
}
);
}
}
run.index=0;
run.time=0;
function go_to(index){
run.index=index;
var left=565*index;
$("#pnl_scroll").animate({
left:'-'+left+'px'}
,cfg.scroll,function(){
$("#pnl_btn li.on").removeClass("on");
$("#pnl_btn li").eq(run.index).addClass("on");
}
);
}
function start_auto(){
stop_auto();
run.time=setTimeout(run,cfg.stop);
}
function stop_auto(){
clearTimeout(run.time);
}
$(function(){
start_auto();
$("#pnl_btn,#pnl_scroll").hover(function(){
stop_auto();
}
,function(){
start_auto();
}
);
$("#pnl_btn li").each(function(i,j){
$(this).click(function(){
go_to(i);
}
);
}
);
setInterval(function(){
$("li",$("#pnl_ey")).first().appendTo($("#pnl_ey"));
}
,4000);
$("#pnl_speak_b").mouseenter(function(){
$("#pnl_speak").height(130);
}
).mouseleave(function(){
$("#pnl_speak").height(55);
}
);
$("#pnl_together_b").mouseenter(function(){
$("#pnl_together").show();
}
).mouseleave(function(){
$("#pnl_together").hide();
}
);
$('#slide_box').mfwSlide();
}
);
//寻找旅行家 自动翻转$.fn.mfwSlide = function(options){
var settings = $.extend({
'width':260,'height':240,'speed':300,'thumb_box':'.slide_tab','prev_btn':'','next_btn':'','thumb_focus_class':'on','auto_play':true,'interval':10}
,options);
return this.each(function(){
var i = 0;
//当前图片索引 $(this).width(settings.width).height(settings.height);
var li = $(this).find('ul>li').css('position','absolute');
var n = li.length-1;
//图片总数 var speed = settings.speed;
//li.find('img').width(settings.width).height(settings.height);
if(n>0){
li.not(":first").css({
left:settings.width + "px"}
);
li.eq(n).css({
left:'-'+settings.width + "px"}
);
var thumb_box = $(this).find(settings['thumb_box']).css('overflow','hidden');
var thumb = thumb_box.find('li');
thumb.eq(0).addClass(settings['thumb_focus_class']);
var fun_next_img = function (){
if (!li.is(":animated")){
li.eq(i).animate({
left:'-' + settings.width + "px"}
,{
duration:speed}
);
thumb.filter('.'+settings['thumb_focus_class']).removeClass(settings['thumb_focus_class']);
if(n==1){
li.eq(!i).css({
left:settings.width + "px"}
);
li.eq(!i).animate({
left:'0'}
,{
duration:speed}
);
i=!i;
thumb.eq(i).addClass(settings['thumb_focus_class']);
}
else{
if (i>=n){
li.eq(0).animate({
left:"0"}
,{
duration:speed,complete:function(){
li.eq(n-1).css({
left:settings.width + "px"}
);
i = 0;
thumb.eq(i).addClass(settings['thumb_focus_class']);
}
}
);
}
else{
li.eq(i+1).animate({
left:"0"}
,{
duration:speed,complete:function(){
if(i==0){
li.eq(n).css({
left:settings.width + "px"}
);
}
else{
li.eq(i-1).css({
left:settings.width + "px"}
);
}
i++;
thumb.eq(i).addClass(settings['thumb_focus_class']);
}
}
);
}
;
}
}
;
}
;
var fun_prev_img = function (){
if (!li.is(":animated")){
li.eq(i).animate({
left:settings.width + "px"}
,{
duration:speed}
);
thumb.filter('.'+settings['thumb_focus_class']).removeClass(settings['thumb_focus_class']);
if(n==1){
li.eq(!i).css({
left:"-" + settings.width + "px"}
);
li.eq(!i).animate({
left:'0'}
,{
duration:speed}
);
i=!i;
thumb.eq(i).addClass(settings['thumb_focus_class']);
}
else{
if (i<=0){
li.eq(n).animate({
left:"0"}
,{
duration:speed,complete:function(){
li.eq(n-1).css({
left:'-'+settings.width + "px"}
);
i = n;
thumb.eq(i).addClass(settings['thumb_focus_class']);
}
}
);
}
else{
li.eq(i-1).animate({
left:"0"}
,{
duration:speed,complete:function(){
if(i==1){
li.eq(n).css({
left:'-'+settings.width + "px"}
);
}
else{
li.eq(i-2).css({
left:'-'+settings.width + "px"}
);
}
i--;
thumb.eq(i).addClass(settings['thumb_focus_class']);
}
}
);
}
}
}
;
}
;
fun_jump_img = function($this){
var id = $this.data('id');
thumb.filter('.'+settings['thumb_focus_class']).removeClass(settings['thumb_focus_class']);
$this.addClass(settings['thumb_focus_class']);
if(i!=id){
li.eq(i).animate({
left:'-' + settings.width + "px"}
,{
duration:speed}
);
li.eq(id).css({
left:settings.width + "px"}
);
li.eq(id).animate({
left:'0'}
,{
duration:speed,complete:function(){
if(id==0){
li.eq(n).css({
left:'-'+settings.width + "px"}
);
}
else{
li.eq(id-1).css({
left:'-'+settings.width + "px"}
);
}
if(id==n){
li.eq(0).css({
left:settings.width + "px"}
);
}
else{
li.eq(id+1).css({
left:settings.width + "px"}
);
}
i = id;
}
}
);
}
}
;
if(settings['auto_play']){
time = setInterval(fun_next_img,settings['interval']*1000);
}
if(settings.next_btn!=''){
$(settings['next_btn']).click(function(){
clearInterval(time);
fun_next_img();
}
);
}
if(settings.prev_btn!=''){
$(settings['prev_btn']).click(function(){
clearInterval(time);
fun_prev_img();
}
);
}
thumb.click(function(){
clearInterval(time);
var $this = $(this);
fun_jump_img($this);
}
);
}
}
);
}
//顶文章推荐开放平台function ginfo_ding_activities(id,type,element){
var tip_element = $(element).nextAll('.layer_sync');
//检查用户是否设置同步 check_connect_setting(5,'sina',function(){
//未设置 //检查周期内是否提示过 check_connect_remind('sina','ginfo_ding',function(){
//未提示过 tip_element.find('.pop_wrap[key="remind"]').find('.close,.operation .sync_cancel').unbind('click').bind('click',function(){
tip_element.find('.pop_wrap[key="remind"]').fadeOut(300);
}
).end().find('.operation .sync_submit').unbind('click').bind('click',function(){
tip_element.find('.pop_wrap[key="remind"]').fadeOut(300);
//设置同步 set_connect_setting(5,'sina');
//请求接口 update_activities(id,type,'ginfo_ding',function(){
tip_element.find('.pop_wrap[key="result"]').html('<div class="succSync"><b></b>推荐成功!</div><p>你可以通过窝内的<a href="/home/usershare.php?show_id=sina_setting" target="_blank">账号同步</a>更改同步设置。</p>').fadeIn(300);
setTimeout(function(){
tip_element.find('.pop_wrap[key="result"]').fadeOut(300);
}
,5000);
//统计发送动态数 add_op_log('sgda','sendsuccess');
}
,function(){
tip_element.find('.pop_wrap[key="result"]').html('<div class="succSync"><b></b>抱歉,推荐失败,请稍候再试!</div>').fadeIn(300);
setTimeout(function(){
tip_element.find('.pop_wrap[key="result"]').fadeOut(300);
}
,5000);
}
);
//统计开启同步数 add_op_log('sgda','openservice');
}
).end().fadeIn(300);
//统计弹窗数 add_op_log('sgda','remindtip');
}
);
}
,function(){
//已设置 //请求接口 update_activities(id,type,'ginfo_ding',function(){
//统计发送动态数 add_op_log('sgda','sendsuccess');
}
);
}
);
}
//绑定手机号function invite_bang(){
$.post("/login/invite_friend.php",{
action:"bang"}
,function(d){
if(d.ret==1){
if(d.msg==1){
todo_1(d.html);
}
else{
todo_2(d.html);
}
}
else{
majaxerr(d);
}
}
,"json");
}
function todo_1(html){
$.prompt(html,{
buttons:{
"提交":true}
,submit:function(v,m,f){
if(v){
var _name = $("#true_name",$(m)).val();
var _mobile = $("#invite_mobile",$(m)).val();
var _invite_code = $("#invite_code",$(m)).val();
$.post("/login/invite_friend.php",{
action:"verify_code",true_name:_name,mobile:_mobile,invite_code:_invite_code}
,function(d){
if(d.ret==1){
invite_bang();
$.prompt.close();
}
else{
$("#err_msg").html(d.msg);
//majaxerr(d);
}
}
,"json");
}
return false;
}
}
);
}
function todo_2(html){
$.prompt(html,{
buttons:{
"确认邀请":true}
,submit:function(v,m,f){
if(v){
var _name1=$("#invite_name1",$(m)).val();
var _name2=$("#invite_name2",$(m)).val();
var _name3=$("#invite_name3",$(m)).val();
var _mobile1=$("#invite_mobile1",$(m)).val();
var _mobile2=$("#invite_mobile2",$(m)).val();
var _mobile3=$("#invite_mobile3",$(m)).val();
if("姓名1" == _name1){
_name1 = "";
}
if("姓名2" == _name2){
_name2 = "";
}
if("姓名3" == _name3){
_name3 = "";
}
if("手机号1" == _mobile1){
_mobile1 = "";
}
if("手机号2" == _mobile2){
_mobile2 = "";
}
if("手机号3" == _mobile3){
_mobile3 = "";
}
$.post("/login/invite_friend.php",{
action:"invite",name1:_name1,name2:_name2,name3:_name3,mobile1:_mobile1,mobile2:_mobile2,mobile3:_mobile3}
,function(d){
if(d.ret==1){
mTinyAlert("操作成功!");
$.prompt.close();
}
else if(d.ret == 10){
var msg = d.msg;
err_arr = msg.split(",");
var key =0;
for(i=0;
i<err_arr.length;
i++){
key = err_arr[i];
if(!$("#li_A"+key).hasClass("on")&&!$("#li_A"+key).hasClass("off")){
$("#li_A"+key).removeClass();
$("#li_A"+key).addClass("A"+key+" err");
}
}
return false;
}
else{
majaxerr(d);
$.prompt.close();
}
}
,"json");
}
return false;
}
}
);
}
//页面加载完成加载方法jQuery(function(){
var pagepara="start";
//获取内容 function getC(_url){
//jQuery("#div_loadingpanel").show();
jQuery.post(_url,{
type:jQuery("#smallpager").data("type")}
,function(d){
if(d.ret==1){
jQuery("#pnl_content").fadeOut(700,function(){
jQuery(this).html(d.html).show();
jQuery("html,body").animate({
scrollTop:jQuery("#pnl_btns").offset().top}
,1500);
}
);
updatePager(d.nowpage,d.recordcount,d.pagesize);
jQuery("#div_loadingpanel").hide();
}
else{
majaxerr(d);
}
}
,"json");
}
//更新分页 function updatePager(page,rnum,psize){
jQuery("#smallpager").html("").Pager({
config:"index",recordcount:rnum,pagesize:psize,nowpage:page,url:"/ajax/ajax_article.php",pageparameter:pagepara}
) .find("a").click(function(){
var _url=jQuery(this).attr("href");
if(_url.indexOf(pagepara)>0){
getC(_url);
}
return false;
}
);
}
//btn绑定 begin jQuery("#btn_tp0").click(function(){
jQuery("#pnl_btns li.on").removeClass("on");
jQuery(this).parent().addClass("on");
jQuery("#smallpager").data("type","0");
getC("/ajax/ajax_article.php?"+pagepara+"=1");
}
).focus(function(){
jQuery(this).blur();
}
);
jQuery("#btn_tp1").click(function(){
jQuery("#pnl_btns li.on").removeClass("on");
jQuery(this).parent().addClass("on");
jQuery("#smallpager").data("type","1");
getC("/ajax/ajax_article.php?"+pagepara+"=1");
}
).focus(function(){
jQuery(this).blur();
}
);
jQuery("#btn_tp2").click(function(){
jQuery("#pnl_btns li.on").removeClass("on");
jQuery(this).parent().addClass("on");
jQuery("#smallpager").data("type","2");
getC("/ajax/ajax_article.php?"+pagepara+"=1");
}
).focus(function(){
jQuery(this).blur();
}
);
jQuery("#btn_tp3").click(function(){
jQuery("#pnl_map").toggle();
}
).focus(function(){
jQuery(this).blur();
}
);
//jQuery('#pnl_map').bind("mouseleave",function(){
jQuery(this).hide();
}
);
//btn绑定 end updatePager(1,1000,15);
jQuery("#smallpager").data("type","0");
// if(_IS_LOGIN_ =="0"){
// if(!$.cookie("mmfw_open",{
path:'/'}
)){
// $("#mmfw-open").show().delegate('a.close','click',function (e){
// $.cookie("mmfw_open",1,{
expires:1,path:'/',domain:'mafengwo.cn'}
);
// e.preventDefault();
// $("#mmfw-open").remove();
//}
);
//}
//}
if(!$.cookie("xcuxm",{
path:'/'}
)){
$("<img/>").attr("src","http://www.agoda.com.cn/?cid=1603926");
$.cookie("xcuxm",1,{
expires:2,path:'/',domain:'mafengwo.cn'}
);
}
function getPostalCardHtml(){
$.post("/activity/ajax_postal_action.php",{
'action':'indexleft'}
,function(d){
if(d.ret==1){
$("div._j_postalcard").html(d.html).show();
}
}
,"json");
}
getPostalCardHtml();
}
);
CSS代码(zzsc.css):
@charset "utf-8";body,div,p,ul,ol,li,dl,dt,dd,form,h1,h2,h3,h4,h5,h6{margin:0;padding:0}
img{border:0 none}
a{text-decoration:none}
a:hover{text-decoration:underline}
ul,ol,li{list-style:none}
h1,h2,h3,h4,h5,h6{font-size:12px}
body{background-color:#fff}
.clear{clear:both;display:block;height:0;font-size:0;line-height:0;overflow:hidden}
.cf:after{content:'\20';clear:both;display:block}
.cf{zoom:1}
.mt10{margin-top:10px}
.mb10{margin-bottom:10px}
.p_t_10{padding-top:10px}
.fl{float:left}
.fr{float:right}
.w980{width:980px;margin:0 auto}
.fast-nav-wrap .fast-nav-bd{display:block}
.fast-nav-hd{background:0;background-color:#ff8a00}
.mfw_main{width:980px;margin:0 auto;padding:0 10px}
.mfw_main .content{width:690px;float:right;padding-top:7px}
.mfw_main .slide{border-radius:5px;height:385px;overflow:hidden}
.mfw_main .slide .play{float:left;height:385px;width:565px;overflow:hidden;position:relative}
.mfw_main .slide .play ul{position:absolute;top:0;width:3000px}
.mfw_main .slide .play li{float:left;height:385px;width:565px;overflow:hidden}
.mfw_main .slide .play li img{-moz-border-radius-topleft:5px;-moz-border-radius-bottomleft:5px;-webkit-border-top-left-radius:5px;-webkit-border-bottom-left-radius:5px}
.mfw_main .slide .tab{float:right;width:125px;height:350px;overflow:hidden;-moz-border-radius-bottomright:5px;-webkit-border-bottom-right-radius:5px}
.mfw_main .slide .tab li{width:108px;height:67px;margin-bottom:4px;padding-left:17px;overflow:hidden;font-size:0;*vertical-align:top}
.mfw_main .slide .tab li.on{background:url(slide_arr.gif?v=2) 5px center no-repeat}
.mfw_main .focus .info{color:#666;height:35px;line-height:35px;font-size:14px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.mfw_main .focus .info a{color:#e58a00;font-size:14px}
.ad690,.da690{margin:15px 0;border-radius:5px;width:690px;height:100px;position:relative;overflow:hidden}
.ad690 a,.da690 a{font-size:0}
.ad6902,.da6902{margin:15px 0}
.ad6902 a,.da6902 a{font-size:0}
.da690 .flash_mask{display:block;width:690px;height:100px;position:absolute;left:0;top:0;z-index:2;line-height:500px;overflow:hidden}
.ad690 img,.da690 img{vertical-align:middle}
.content .box{margin-top:10px}
.content .title{height:35px;border-bottom:1px solid #dbdbdb;line-height:35px;clear:both}
.content .title h2{float:left;padding-left:25px;background:url(/images/mdd_new/city_sprites.gif?v=10) no-repeat;font-size:16px;_font-size:14px;color:#444;font-weight:normal;_font-weight:bold}
.content .title h2 a{font-size:16px;_font-size:14px;color:#444}
.content .postBox{margin-top:0}
.content .postBox h2{background-position:-180px -659px}
.post_main{margin-top:0}
.post_main .hd{height:35px;border-bottom:1px solid #dbdbdb}
.post_main .hd ul{float:left;margin-top:13px}
.post_main .hd li{float:left;height:17px;width:72px;padding:5px 0 0 0;margin-right:2px;background:url(/images/lushu/poi_beta4/city_sprites.gif) -73px -220px no-repeat;font-size:12px;position:relative;bottom:-1px;text-align:center;line-height:12px}
.post_main .hd li b{position:absolute;left:0;top:13px;width:1px;height:10px;background:url(/images/lushu/poi_beta4/city_sprites.gif) no-repeat -164px 0;display:none}
.post_main .hd li a{color:#666;font-size:12px}
.post_main .hd li a:hover{color:#fa0;text-decoration:none}
.post_main .hd li.on{background:url(/images/lushu/poi_beta4/city_sprites.gif) no-repeat;background-position:0 -220px}
.post_main .hd li.on a,.post_main .hd li.on a:hover{color:#fff}
.post_main .hd .tips{float:left;padding-left:20px;margin:13px 0 0 125px;line-height:20px;position:relative;line-height:none}
.post_main .hd .tips b{display:block;height:16px;width:16px;background:url(/images/lushu/poi_beta4/city_sprites.gif) no-repeat 0 -21px;position:absolute;left:0;top:3px}
.post_main .hd .tips a{color:#ff9500}
.post_main .hd .add_post{float:right}
.post_main .hd .add_post a{display:block;width:111px;height:30px;background:url(/images/lushu/poi_beta4/city_sprites.gif) 0 -243px no-repeat;overflow:hidden;line-height:200px}
.content .new_post{float:right;padding-top:2px}
.content .new_post a{display:block;width:111px;height:30px;background:url(/images/lushu/poi_beta4/city_sprites.gif) 0 -243px no-repeat;overflow:hidden;line-height:200px}
.post_main .post_item{padding:20px 0;background:0}
.post_list ul{border-bottom:1px solid #cecece}
.post_item{margin-top:-1px;border-top:1px dashed #cecece;color:#666}
.post_item a{color:#fa0}
.post_item .pic{display:inline;float:left;width:195px;height:125px;position:relative;*margin-right:12px}
.post_item .pic .ico,.post_item .pic .top{position:absolute;top:-2px;left:-2px;width:50px;height:57px;background:url(/images/mdd_new/icon_baozang.png) no-repeat;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/mdd_new/icon_baozang.png",sizingMethod="crop");_background:0;overflow:hidden;line-height:200px}
.post_item .pic .icon_digest{position:absolute;top:-2px;left:-1px;width:50px;height:56px;background:url(/images/mdd_new/digest_icon.png) no-repeat;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/mdd_new/digest_icon.png",sizingMethod="crop");_background:0;overflow:hidden}
.post_item .pic a{display:block;width:195px;height:125px;overflow:hidden}
.post_item .pic img{vertical-align:middle}
.post_item dl{margin-left:210px;width:480px;_margin-left:205px}
.post_item dd{float:left;width:340px;padding:0;_overflow:hidden}
.post_item h2{height:25px;margin-bottom:10px;font-size:16px;overflow:hidden;font-weight:normal}
.post_item h2 a{font-size:20px;color:#fa0}
.post_item .author{height:22px;position:relative;width:480px;float:none}
.post_item .author img{float:left;margin:1px 5px 0 0}
.post_item .author p{float:left;height:20px;overflow:hidden}
.post_item .authorA{width:150px}
.post_item .authorB{position:absolute;left:150px;top:0;width:300px}
.post_item .post_info{padding-top:5px;float:none;width:auto;font-size:14px;line-height:22px}
.post_item dt{float:right;width:130px;_width:120px}
.post_item .count{padding-top:5px;text-align:center}
.post_item .count span{display:inline-block;margin:0 5px}
.post_item .count .view b{width:18px;background-position:0 -40px}
.post_item .count .reply b{background-position:0 -26px}
.post_item .like{width:50px;margin:30px 0 0 50px;text-align:center;color:#fa0;font-size:14px}
.post_item .like .btn{display:block;margin:0 auto 5px;width:42px;height:40px;background:url(/images/lushu/poi_beta4/city_sprites.gif) 0 -274px no-repeat;overflow:hidden;line-height:200px}
.post_item .count b{display:inline-block;margin-right:5px;width:16px;height:14px;background:url(/images/mdd_new/mdd_detail_png2.png) 0 -13px no-repeat;vertical-align:middle;*vertical-align:0}
.index_side{float:left;width:260px;margin-top:385px}
.mdd_nav .inner{width:248px;border:1px solid #fa0;position:relative;zoom:1;z-index:10}
.mdd_nav h2{height:33px;padding-left:6px;background:url(/images/mdd_nav_bg2.gif) repeat-x 0 -3px;color:#964701;font-weight:normal;line-height:33px;font-size:16px}
.mdd_nav dl{height:32px;font-size:14px}
.mdd_nav dl.hover dt,.mdd_nav dl:hover dt{background:#fff;width:239px;z-index:100;width:249px;margin-right:-1px}
.mdd_nav dl.hover dd,.mdd_nav dl:hover dd{display:block}
.mdd_nav dt{position:relative;width:248px;height:31px;background:url(/images/mdd_nav_bg2.gif) repeat-x 0 -39px;border-top:1px solid #fa0;color:#666;line-height:29px;cursor:pointer;font-size:14px;color:#414141}
.mdd_nav dt strong{float:left;padding-left:33px;font-weight:normal}
.mdd_nav dt b{position:absolute;left:8px;top:7px;width:16px;height:16px;background:url(/images/mdd_nav_bg2.gif) no-repeat;overflow:hidden;font-size:0;line-height:0}
.mdd_nav dt.tit1 b{background-position:0 -71px}
.mdd_nav dt.tit2 b{background-position:-17px -71px}
.mdd_nav dt.tit3 b{background-position:-33px -71px}
.mdd_nav dt.tit4 b{background-position:-49px -71px}
.mdd_nav dt.tit5 b{background-position:-66px -71px}
.mdd_nav dd{position:absolute;left:248px;top:33px;z-index:98;width:400px;padding:5px 15px 7px;background-color:#fff;border:1px solid #fa0;border-radius:0 5px 5px 5px;line-height:25px;display:none;z-index:98}
.mdd_nav dd h3{color:#2e2e2e;font-size:14px}
.mdd_nav dd p a{display:inline-block;width:195px;color:#666;font-size:14px}
.mdd_nav dd p a:hover{font-size:14px;color:#666}
.mdd_nav dd.short p a{width:95px}
.mdd_nav dd p a em{font-size:12px;font-style:normal}
.mdd_nav dd .extra{margin-top:5px;padding:5px 0;border-top:1px dashed #dbdbdb;text-align:center}
.mdd_nav dd .extra a{color:#e58a00}
.together{margin-top:15px;background-color:#fff9e6;padding:10px;color:#666;position:relative;z-index:2;_zoom:1}
.together a{color:#e58a00}
.together .title{height:32px;line-height:32px}
.together .title h2{float:left;padding-left:25px;background:url(/images/index_sprites4.gif) no-repeat -177px -365px;color:#582e09;font-weight:bold;font-size:14px}
.together .title .btn{float:right;margin-top:7px;width:72px;height:20px;display:block;background:url(/images/index_sprites4.gif) no-repeat 0 -23px;text-indent:18px;line-height:21px;color:#fff;font-family:"宋体";overflow:hidden}
.together .title .btn:hover{text-decoration:none}
.together .toge_icon{width:9px;height:10px;background:url(/images/index_sprites4.gif) no-repeat -13px -152px;font-size:0;overflow:hidden}
.together p{height:22px;overflow:hidden;line-height:22px}
.together p img{margin-right:5px}
.together p b{color:#333}
.together ul{position:absolute;left:0;width:230px;background-color:#fff9e6;padding:10px}
.together ul li{height:24px;border-bottom:1px dashed #ede3c2;line-height:24px;overflow:hidden}
.together ul li a{margin:0 2px}
.together ul li a.grayLink{color:#666}
.index_side .box{margin-top:15px}
.index_side .box .title{height:35px;line-height:35px;clear:both;overflow:hidden;border-bottom:1px solid #dadada;margin-bottom:8px}
.index_side .title .fr{padding-right:8px}
.index_side .title .fr a{color:#8d8d8d}
.index_side .box .h{float:left;padding-left:10px;font-size:16px;color:#582e09;font-weight:normal}
.index_side .box .h h2{display:inline;font-size:16px;color:#582e09;font-weight:normal}
.index_side .box .h a{font-size:16px;color:#582e09;font-weight:normal}
.index_side .box .h a:hover{font-size:16px;color:#582e09}
.index_side .book .h{background-position:-180px -38px}
.index_side .book .cont{margin:5px 10px;overflow:hidden;padding-top:10px}
.index_side .book .book_img{float:left;margin-right:15px;display:inline;*zoom:1;height:100px}
.index_side .book .info{float:right;width:135px}
.index_side .book strong{display:block;height:30px;line-height:30px;overflow:hidden}
.index_side .book strong a{color:#323232;font-size:22px}
.index_side .book p{padding-right:10px;height:40px;color:#818181;line-height:20px;overflow:hidden}
.index_side .book .btn{display:inline-block;float:left;margin-right:5px;margin-top:10px!important;position:relative;width:50px;height:19px;background:url(/images/index_sprites4.gif) no-repeat 0 -44px;overflow:hidden;*zoom:1}
.index_side .book .btn a{display:block;position:absolute;line-height:100px}
.index_side .book .view_at{display:inline-block;margin-top:10px;height:19px;padding:0 9px;background-color:#ff8a00;color:#fff;line-height:19px;vertical-align:top;border-radius:3px}
.index_side .book .view_at:hover{text-decoration:none}
.index_side .book .hide{display:none}
.index_side .book .list{padding:5px 10px;_padding-top:10px;color:#666;clear:both}
.index_side .book .list li{height:25px;line-height:25px;_height:22px;_margin-bottom:3px;overflow:hidden}
.index_side .book .list img{margin-right:5px}
.index_side .book .list a{color:#e58a00}
.index_side .book .list a:hover{color:#e58a00}
.index_side .book .list a.u{color:#e58a00}
.index_side .book .list a.u:hover{color:#e58a00}
.index_side .book .list a.b{font-weight:bold;margin-right:5px}
.index_side .travelers .h{background-position:-177px -403px}
.travelers .cont{width:260px;height:240px;position:relative;overflow:hidden;color:#666}
.travelers ul{position:absolute;left:0;top:0;width:1000px}
.travelers ul li{float:left;width:260px;float:left}
.travelers ul dt{height:140px;overflow:hidden}
.travelers ul img{vertical-align:middle}
.travelers ul dd{padding:5px 0;line-height:20px}
.travelers ul h3{margin:5px 0;font-size:16px}
.travelers ul h3 a{font-size:16px;color:#ff8a00}
.travelers ul dd img{margin:0 5px 0 0;vertical-align:-4px;*vertical-align:middle}
.travelers ul a{color:#604214}
.travelers ul p{padding-top:5px}
.travelers ol{position:absolute;right:7px;top:128px;text-align:right}
.travelers ol li{float:left;margin-left:3px;width:12px;height:4px;background-color:#fff;line-height:100px;overflow:hidden;border-radius:2px;cursor:pointer}
.travelers ol li.on{background-color:#ff8a00!important;color:#fff}
.travelers ol li:hover{background-color:#fbe9d4}
.postcard .cont{margin-top:10px;color:#666;line-height:24px}
.postcard .cont em,.postcard .cont b{padding:0 2px;position:relative;bottom:-1px;font-size:16px;font-style:normal;font-weight:bold;color:#3ac5f2}
.postcard .cont b{color:#ffa800}
.postcard .cont ul{margin:10px 0 10px -10px;overflow:hidden;*zoom:1}
.postcard .cont li{float:left;display:inline;margin-left:10px;width:78px}
.postcard .cont li img{display:block}
.postcard .cont li a{display:block}
.postcard .cont a{color:#666}
.postcard .cont a:hover{text-decoration:none}
.postcard .cont .btn_diy{display:inline-block;margin-top:5px;padding:0 10px;background-color:#45c7f7;color:#fff;border-radius:3px}
.postcard .cont .btn_diy:hover{background-color:#1ebbf5;color:#ffff3e}
.index_side .m_app .h{background-position:-178px -90px}
.index_side .m_app .cont{padding:5px 0;background-color:#fff8e4}
.index_side .m_app ul li{padding:5px 10px;color:#666}
.index_side .m_app .app_img{float:left;margin-right:15px;width:74px;height:74px}
.index_side .m_app strong{display:block;padding:5px 0 0 0;font-size:14px}
.index_side .m_app strong a{color:#757472;font-size:14px}
.index_side .m_app p{padding:5px 0;line-height:20px}
.da250{margin:20px 0;overflow:hidden;font-size:0!important;text-align:center}
.da250 a{font-size:0}
.da250 img{vertical-align:middle}
.index_side .event .h{background-position:-177px -138px}
.index_side .event li{margin:10px 0 20px;padding-left:10px;border-left:2px solid #e9e9e9;line-height:20px;color:#999}
.index_side .event li p{color:#582e09}
.index_side .event li p a{color:#582e09}
.index_side .event li a.u{color:#ff9a00}
.site_item{padding:15px 0;color:#666;line-height:18px}
.site_item a{display:block;margin:5px 0;padding:3px 2px;border:2px solid #fff;color:#666}
.site_item a:hover{border-color:#ddd;text-decoration:none}
.site_item img{float:left;margin-right:8px;width:38px;height:34px;background:url(/images/index_sprites4.gif) no-repeat}
.site_item a strong{color:#582e09;font-size:14px}
.site_item .item1{background-position:0 -64px}
.site_item .item2{background-position:-39px -64px}
.site_item .item3{background-position:-78px -64px}
.site_item .item4{background-position:-117px -64px}
.site_item .item5{background-position:-117px -99px}
.index_side .news .h{background-position:-177px -180px}
.news li{height:30px;line-height:30px;padding-left:15px;background:url(/images/index_sprites4.gif) no-repeat -190px -279px;color:#666;overflow:hidden}
.news li a{margin-left:5px;color:#666}
.index_side .promotion{padding-bottom:10px}
.index_side .promotion .h{background-position:-177px -226px}
.index_side .promotion .cont{padding-top:8px}
.index_side .promotion .cont li{height:30px;line-height:30px;padding-left:15px;background:url(/images/index_sprites4.gif) no-repeat -190px -279px;color:#582e09;overflow:hidden}
.index_side .promotion .cont a{color:#582e09}
.mdd_nav dd.new_nav{width:520px;padding:5px 10px 7px 5px;font-size:12px}
.mdd_nav dd.new_nav li{overflow:hidden;zoom:1}
.mdd_nav dd.new_nav li.red a{color:red}
.mdd_nav dd.new_nav a{color:#666;font-size:12px}
.mdd_nav dd.new_nav a:hover{font-size:12px;color:#9b5128}
.mdd_nav dd.new_nav a.red{color:red}
.mdd_nav dd.new_nav strong{float:left;width:65px;height:16px;line-height:16px;text-align:right;padding-right:5px;border-right:1px solid #cbcbcb;margin:5px 10px 0 0;color:#666}
.mdd_nav dd.new_nav p{float:left;width:435px;line-height:25px}
.mdd_nav dd.new_nav .avis strong{width:158px}
.mdd_nav dd.new_nav .avis_logo{display:inline-block;width:92px;height:14px;background:url(/images/avis.gif) no-repeat;line-height:200px;overflow:hidden;vertical-align:middle}
.mdd_nav dd.new_nav .avis p{width:330px}
.mdd_nav dd.new_nav .hansa strong{width:158px}
.mdd_nav dd.new_nav .hansa p{width:330px}
.mdd_nav dd.new_nav .hansa_logo{display:inline-block;width:92px;height:14px;background:url(/images/da/hansa.gif) no-repeat;line-height:200px;overflow:hidden;vertical-align:middle}
.mdd_nav dd.new_nav p a{display:inline-block;margin-right:5px;width:auto}
.mdd_nav dd.new_nav p span{display:inline-block;margin-right:5px;color:#666}
.mdd_nav dd.new_nav p a:hover{font-size:12px;color:#9b5128}
.mdd_nav dd.new_nav .extra a{color:#e58a00}
.mdd_nav dd.new_nav .extra a:hover{font-size:12px}
.layer_sync{position:relative;height:0;width:0}
.layer_sync .pop_wrap{position:absolute;bottom:65px;right:-70px;width:250px;padding:10px 20px;border:5px solid #e6e6e6;background-color:#fff;color:#444;font-size:12px;line-height:22px;border-radius:3px;text-align:center}
.layer_sync .pop_wrap a{color:#ff8a00}
.layer_sync .pop_wrap p{margin-bottom:10px}
.layer_sync .pop_wrap div{margin-top:10px;text-align:center}
.layer_sync .pop_wrap div a,.layer_sync .pop_wrap div input{float:none!important;display:inline-block;padding:0 8px!important;margin:0 10px;border:0 none!important;font-size:12px;text-shadow:none!important;font-weight:normal!important;line-height:20px;border-radius:3px;cursor:pointer}
.layer_sync .pop_wrap div input{width:45px}
.layer_sync .pop_wrap div a.sync_submit,.layer_sync .pop_wrap div input.sync_submit{background-color:#ffa800;background-image:none;color:#fff}
.layer_sync .pop_wrap div a.sync_cancel,.layer_sync .pop_wrap div input.sync_cancel{background-color:#efeeee;background-image:none;color:#999}
.layer_sync .pop_wrap div a:hover{text-decoration:none}
.layer_sync .close{position:absolute;right:8px;top:8px;width:14px;height:14px;background:url(/images/flight/flight_sprite11.gif) no-repeat -44px -25px;line-height:200px;overflow:hidden;cursor:pointer}
.layer_sync .pop_wrap .succSync{margin-bottom:10px;margin-top:5px;font-size:16px}
.layer_sync .pop_wrap .succSync b{display:inline-block;margin-right:5px;width:15px;height:15px;background:url(/images/flight/flight_sprite11.gif) no-repeat 0 -230px;font-size:0;line-height:0;vertical-align:-2px;*vertical-align:middle;overflow:hidden}
.guide_step1{position:absolute;top:0;left:50%;z-index:1000;margin-left:-90px;width:440px;height:500px;background:url(/images/newuserguide/guide_step1.png) no-repeat;_background:url(/images/newuserguide/guide_step1.gif) no-repeat;overflow:hidden}
.guide_step1 .highlight{position:absolute;left:6px;top:235px;width:372px;height:163px;background:url(/images/newuserguide/guide_step1.png) no-repeat left bottom;_background:url(/images/newuserguide/guide_step1.gif) no-repeat left bottom}
.guide_step1 .guide_btn{position:absolute;z-index:2;margin:383px 0 0 245px;width:140px;height:65px;overflow:hidden;line-height:200px;cursor:pointer}
.guide_step2{position:absolute;top:55px;left:50%;z-index:1000;margin-left:-260px;width:660px;height:404px;background:url(/images/newuserguide/guide_step2.png) no-repeat;_background:url(/images/newuserguide/guide_step2.gif) no-repeat;overflow:hidden}
.guide_step2 .highlight{position:absolute;left:315px;top:148px;width:282px;height:73px;background:url(/images/newuserguide/guide_step2.png) no-repeat left bottom;_background:url(/images/newuserguide/guide_step2.gif) no-repeat left bottom}
.guide_step2 .guide_btn{position:absolute;z-index:2;margin:290px 0 0 468px;width:140px;height:65px;overflow:hidden;line-height:200px;cursor:pointer}
.guide_step3{position:absolute;top:0;left:50%;z-index:1000;margin-left:-275px;width:625px;height:455px;background:url(/images/newuserguide/guide_step3.png) no-repeat;_background:url(/images/newuserguide/guide_step3.gif) no-repeat;overflow:hidden}
.guide_step3 .highlight{position:absolute;left:173px;top:165px;width:408px;height:146px;background:url(/images/newuserguide/guide_step3.png) no-repeat left bottom;_background:url(/images/newuserguide/guide_step3.gif) no-repeat left bottom}
.guide_step3 .guide_btn{position:absolute;z-index:2;margin:338px 0 0 435px;width:140px;height:65px;overflow:hidden;line-height:200px;cursor:pointer}
.guide_step4{position:absolute;top:43px;left:50%;z-index:1000;margin-left:-97px;width:440px;height:411px;background:url(/images/newuserguide/guide_step4.png) no-repeat;_background:url(/images/newuserguide/guide_step4.gif) no-repeat;overflow:hidden}
.guide_step4 .highlight{position:absolute;left:77px;top:141px;width:307px;height:126px;background:url(/images/newuserguide/guide_step4.png) no-repeat left bottom;_background:url(/images/newuserguide/guide_step4.gif) no-repeat left bottom}
.guide_step4 .guide_btn{position:absolute;z-index:2;margin:300px 0 0 250px;width:140px;height:65px;overflow:hidden;line-height:200px;cursor:pointer}
#slide_box{width:260px;height:240px;margin-left:auto;margin-right:auto;margin-top:0;overflow:hidden;position:relative}
#slide_box ul li{position:absolute}
.download_ww_apps{height:75px;border-bottom:1px solid #454444;background:url(/images/header/mobile_top_bg.png) repeat-x;display:table;width:100%}
.download_ww_apps a:hover{text-decoration:none}
.download_ww_apps a:focus{outline:0}
.download_apps_con{display:table-cell;height:75px;vertical-align:middle}
.download_apps_con img{float:left;margin:7px 40px 0 30px}
.download_apps_con strong{font-weight:bold;font-size:24px;color:#fff;line-height:74px}
.download_apps_close{display:table-cell;width:66px;height:75px;background:url(/images/header/mobile_top_close.png) no-repeat center center}
.content{padding:0}
.topBanner{margin-bottom:10px;position:relative}
.topBanner img{vertical-align:middle}
.topBanner b{position:absolute;width:20px;height:20px;right:4px;top:4px;line-height:100px;overflow:hidden;cursor:pointer}
.mmfw-open{width:700px;height:300px;position:absolute;top:175px;left:50%;margin-left:-350px;z-index:99;box-shadow:2px 2px 28px #29ceff}
.mmfw-open .close{width:20px;height:20px;position:absolute;right:0;top:0;display:block;z-index:2}
.mmfw-open .img{z-index:1;position:relative}
.pop_gu{width:750px;margin:0 auto;border:6px solid #ffc65b;background-color:#ffefb4;padding:10px}
.pop_gu .Bclose a.mfwGGCloseBtn{display:block;height:18px;width:18px;background:url(http://file.mafengwo.cn/css/plugins/closeBtn.gif) no-repeat;text-indent:-9999px;outline:0;position:absolute;margin:2px 2px 0 730px;padding:1px}
.pop_gu .ztit{height:20px;padding:8px 0 15px 0;font-size:14px;color:#a05214}
.pop_gu .ztit .num{font-size:14px;font-family:Georgia,"Times New Roman",Times,serif;font-weight:bold;color:#df7d1f}
.pop_gu .tit1{font-size:18px;color:#b74916;font-weight:bold;height:25px}
.pop_gu .tag_A{padding:6px 8px 10px 0;line-height:2.2em;font-size:14px}
.pop_gu .tag_H{height:60px;overflow:hidden}
.pop_gu .tag_A{padding:6px 8px 10px 0;line-height:2.2em;font-size:14px}
.pop_gu .tag_A .tag1 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#fc4a19;margin-right:3px}
.pop_gu .tag_A .tag1 a:hover{background-color:#fc4a19;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag1 .on{background-color:#fc4a19;color:#FFF}
.pop_gu .tag_A .tag2 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#2da9cf;margin-right:3px}
.pop_gu .tag_A .tag2 a:hover{background-color:#2da9cf;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag2 .on{background-color:#2da9cf;color:#FFF}
.pop_gu .tag_A .tag3 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#8cb71e;margin-right:3px}
.pop_gu .tag_A .tag3 a:hover{background-color:#8cb71e;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag3 .on{background-color:#8cb71e;color:#FFF}
.pop_gu .tag_A .tag4 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#fc4a19;margin-right:3px}
.pop_gu .tag_A .tag4 a:hover{background-color:#fc4a19;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag4 .on{background-color:#fc4a19;color:#FFF}
.pop_gu .tag_A .tag5 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#f80;margin-right:3px}
.pop_gu .tag_A .tag5 a:hover{background-color:#f80;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag5 .on{background-color:#f80;color:#FFF}
.pop_gu .tag_A .tag6 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#2da9cf;margin-right:3px}
.pop_gu .tag_A .tag6 a:hover{background-color:#2da9cf;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag6 .on{background-color:#2da9cf;color:#FFF}
.pop_gu .tag_A .tag7 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#8cb71e;margin-right:3px}
.pop_gu .tag_A .tag7 a:hover{background-color:#8cb71e;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag7 .on{background-color:#8cb71e;color:#FFF}
.pop_gu .tag_A .tag8 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#ed678b;margin-right:3px}
.pop_gu .tag_A .tag8 a:hover{background-color:#ed678b;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag8 .on{background-color:#ed678b;color:#FFF}
.pop_gu .tag_A .tag9 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#b6996a;margin-right:3px}
.pop_gu .tag_A .tag9 a:hover{background-color:#b6996a;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag9 .on{background-color:#b6996a;color:#FFF}
.pop_gu .tag_A .tag10 a{font-size:18px;font-family:"微软雅黑","黑体","宋体";font-weight:bold;color:#8cb71e;margin-right:3px}
.pop_gu .tag_A .tag10 a:hover{background-color:#8cb71e;color:#FFF;text-decoration:none}
.pop_gu .tag_A .tag10 .on{background-color:#8cb71e;color:#FFF}
.pop_gu .pointer{width:135px;height:35px;background:url(/images/plugins/icon_pointer.gif) 0 0 no-repeat;padding:0 0 0 38px;line-height:40px;font-size:14px;font-weight:bold;color:#0d2331;margin:15px 0 0 568px}
.pop_gu .btn_A{clear:both;padding:30px 0 20px 290px}
.pop_gu .btn1 a{width:166px;height:51px;background:url(/images/plugins/gu_btn1.gif) no-repeat;display:block;line-height:500px;overflow:hidden}
.pop_gu .btn2 a{width:166px;height:51px;background:url(/images/plugins/gu_btn2.gif) no-repeat;display:block;line-height:500px;overflow:hidden}
.pop_gu .m_list{padding:6px 0 0 0}
.pop_gu .m_list li{width:130px;height:62px;float:left;padding:8px 0 0 10px;margin:1px}
.pop_gu .m_list .on{background-color:#ffc65b}
.pop_gu .m_list li .mlogo{width:65px;float:left}
.pop_gu .m_list li .mlogo img{border:3px solid #f90}
.pop_gu .m_list li .minfo{width:65px;float:left;padding:39px 0 0 0}
.pop_gu .m_list li .minfo a{color:#f60}
.pop_gu .m_list li .i_boy{background:url(/images/oclock8/icon_boy.gif) 0 0 no-repeat}
.pop_gu .m_list li .i_girl{background:url(/images/oclock8/icon_girl.gif) 0 0 no-repeat}
.pop_gu .m_list li .i_unisex{background:url(/images/wengweng/icon_neutral.gif) 0 0 no-repeat}
.pop_gu .c_all{clear:both;width:135px;height:35px;color:#0d2331;margin:15px 0 0 568px}
.pop_gu .mlogo_t{height:25px}
.pop_gu .mlogo_t .L_1{width:130px;float:left;font-size:18px;color:#b74916;font-weight:bold}
.pop_gu .mlogo_t .L_2{width:190px;float:right;font-size:12px;color:#b74916}
.pop_gu .mlogo_A{clear:both;padding:15px 0 0 0}
.pop_gu .mlogo_A .A1{margin:0 0 0 170px;width:120px;height:120px;border:3px solid #f90;background-color:#FFF;float:left}
.pop_gu .mlogo_A .A2{width:150px;height:120px;float:left;background:url(/images/plugins/icon_arrow.gif) 36px 36px no-repeat}
.pop_gu .mlogo_A .A3{width:120px;height:120px;border:3px solid #f90;background-color:#FFF;float:left}
.pop_gu .minput{clear:both;padding:15px 0 0 170px}
.pop_gu .minput input{height:20px}
.btn_orange,.btn_gray{background:#fc9500 url(/images/plugins/btn_bg.gif) no-repeat scroll;border:0 none;cursor:pointer;line-height:21px}
.btn_orange{background-position:0 0;width:50px;height:21px;color:#FFF;font-size:12px}
.pop_gu .btn3 a{width:95px;height:45px;background:url(/images/plugins/btn_ok.gif) no-repeat;display:block;line-height:500px;overflow:hidden}