@charset "utf-8";
/* CSS Document */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0;padding:0; -webkit-text-size-adjust:none;}
table {border-collapse:collapse;border-spacing:0;}
fieldset,img {border:0;}
address,caption,cite,code,dfn,th,var {font-style:normal;font-weight:normal;}
ul {list-style:none;}
ol{ list-style:inside decimal;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
a{ text-decoration:none;color:#7d7d7d;}
a:hover{text-decoration:underline;}
img{ vertical-align:middle; margin:0; padding:0;}
input,textarea,select{ font-family:Arial,Helvetica,sans-serif; outline:none;}
input[type='checkbox']{ vertical-align:text-top; }
/*basic*/
.fl {float:left !important;}
.fr {float:right !important;}
.mt10{ margin-top:10px !important;}
.mr15{ margin-right:15px !important;}
.clear{ clear:both; height:0; overflow:hidden;  }   
.noBor{ background:none !important; border:none !important; margin-right:0 !important;} 
body{font:12px/1.5em Arial, Helvetica, sans-serif; color:#7d7d7d;background:#a5e3fc; }  
.wrap{ width:822px; margin:0 auto; overflow:hidden;}
.bg-1{ background:url(images/bg-1.jpg) no-repeat 50% 0; height:690px; overflow:hidden;}
.bg-1 h1{ display:none;}
.bg-2{ background:url(images/bg-2.jpg) no-repeat 50% 0; height:416px; padding-top:40px; overflow:hidden;}
.bg-2-wrap{ background:url(images/btm-bg.jpg) repeat-x;}
/*btn*/
.buyWinBtn,.buyMacBtn,.buyWinBtn-b,.buyMacBtn-b{ display:block; background:url(images/btn.png) no-repeat; width:78px; height:34px; margin:5px 0 0 -3px;}
.buyWinBtn{ background-position:-92px 0;}
.buyWinBtn:hover{ background-position:-92px -35px;}
.buyMacBtn:hover{ background-position:0 -35px;}
.buyWinBtn-b,.buyMacBtn-b{ width:120px; background-position:-171px 0; margin-left:-8px; margin-top:10px;}
.buyWinBtn-b{ background-position:-308px 0;}
.buyWinBtn-b:hover{ background-position:-308px -36px;}
.buyMacBtn-b:hover{ background-position:-171px -36px;}
/**/
.logo{ margin:25px 95px 0 0; float:right;}
.cloud,.egg{ position:absolute; z-index:5;}
.egg{ display:block; width:113px; height:100px;}
/*mainNav*/
.mainNav{ margin-top:42px;  position:relative; z-index:1;zoom:1; }
.mainNav:hover{ background:url(images/nav-hover-bg.jpg) no-repeat -13px 106px; *background-position:-13px 101px;}
.mainNav li { float:left; }
.mainNav li .title{ display:block; height:173px; }
.mainNav li.item-1 .title{width:225px; }
.mainNav li.item-2 .title{width:210px; }
.mainNav li.item-3 .title{width:208px; }
.mainNav li.item-4 .title{width:165px; }

.mainNav li.item-1:hover .title{ background:url(images/nav-1-hover-bg.png) no-repeat 76px 140px;}
.mainNav li.item-2:hover .title{ background:url(images/nav-2-hover-bg.png) no-repeat 108px 138px;}
.mainNav li.item-3:hover .title{ background:url(images/nav-3-hover-bg.png) no-repeat 118px 106px;}
.mainNav li.item-4:hover .title{ background:url(images/nav-4-hover-bg.png) no-repeat 71px 97px;}

.mainNav li dl{ display:none;  background:#63553f; height:225px; position:absolute; padding:20px 0; left:0px; top:168px; *top:165px; width:819px; z-index:1; overflow:hidden; color:#fff; border-radius:0 0 15px 15px;} 
.mainNav li dl a{ color:#fff;}
.mainNav li:hover dl{ display:block;}
.mainNav li dd{ margin-left:26px;}

.mainNav li.item-1 dd,.mainNav li.item-3 dd{ float:left; width:238px; }


/*proItem*/
.proItem{ width:245px; float:left; padding-right:20px; margin:15px 10px 15px 0; border-right:1px solid #eae8e8;}
.proItem .img{ float:left;}
.proItem .img .save{ background:url(images/save-pic.png) no-repeat; width:57px; height:57px; overflow:hidden; text-align:center; font-size:20px; color:#fff; font-weight:bold; padding-top:4px; margin-top:10px;}
.proItem .text{ padding-left:72px;}
.proItem .text h2{ font-size:16px; margin-bottom:5px;}
.proItem .text h2 a{ color:#3db3f7;}
.proItem .text .priceArea{ width:82px; float:left; margin:10px 0 0;  color:#ff7200;}
.proItem .text .priceArea del{ color:#777; display:block;}

.proItem-btm{ margin-left:70px; width:415px; margin-right:15px;}
.proItem-btm .text{ padding-left:166px;}
.proItem-btm .text .priceArea{ width:122px; font-size:16px;} 

.infoItem{ width:273px; float:left; margin-top:15px;}
.infoItem h3{ font-size:14px; font-weight:bold; margin-bottom:10px;}

/*footer*/
.footer{ text-align:center; color:#749642; margin-top:170px;}

/*popup*/
.popup{ background:url(images/popup-bg.png) no-repeat; width:480px; height:455px; position:fixed; top:33%; left:50%; margin-left:-320px; z-index:21; padding:0 55px 0 110px;}
.popup .closeBtn{ display:block; width:37px; height:48px; float:right; margin:35px 30px 0 0; }
.popup .title{ font-size:35px; line-height:35px; text-align:center; color:#222; margin-bottom:10px; }
.popup .code{ background:url(images/code-bg.png) no-repeat; width:241px; height:48px; line-height:48px; font-size:30px; text-align:center;  color:#ff7200; margin:20px auto;}
.shareBtn,.closeBtn-2{ display:block; background:url(images/popup-btn.png) no-repeat; width:132px; height:44px; margin-top:20px;}
.closeBtn-2{ background-position:-135px 0;}

#sharePopup a{ color:#0072bc;}
#sharePopup .or{ text-align:center; font-size:20px; color:#222; margin:10px 0;}
#sharePopup .input{ background:url(images/input-bg.png) no-repeat; width:204px; height:40px; float:left; margin-right:10px; margin-left:100px;}
#sharePopup .input input{ line-height:40px; margin:0 20px; border:none; background:url(images/input-bg-bg_02.png) repeat-x; color:#777;}
#sharePopup .sendBtn{ display:block; background:url(images/send-btn.png) no-repeat; width:91px; height:44px; float:left;}