﻿/*
CSS Reset
*/

/** 清除内外边距 **/
body, div, p, h1, h2, h3, h4, h5, h6, blockquote,  /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre,  /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea,  /* form elements 表单元素 */
table,th,td /* table elements 表格元素 */{
	margin:0;
	padding:0;
}

body,button,input, select,textarea{
    font: 12px/1.5 "Microsoft Yahei", arial, "宋体" ,sans-serif;
}
h1, h2, h3, h4, h5, h6 { font-size: 100%; line-height: 1; font-weight:normal }
address, cite, em, i { font-style: normal; } /* 将斜体扶正 */
small { font-size: 12px; } /* 小于 12px 的中文很难阅读，让 small 正常化 */

/** 重置列表元素 **/
li { list-style: none; }

/** 重置文本格式元素 **/
a { text-decoration: none; }
a:hover { text-decoration: underline; }

/** 重置表单元素 **/
legend { color: #000; } /* for ie6 */
fieldset, img { border: 0; } /* img 搭车：让链接里的 img 无边框 */
button, input, select, textarea { font-size: 100%; line-height:normal; } /* 使得表单元素在 ie 下能继承字体大小 */

/** 重置表格元素 **/
table{ border-collapse: collapse; border-spacing: 0; }
input[type="button"],input[type="submit"],input[type="reset"]{cursor:pointer;}

/* ie6 7 8(q) bug 显示为行内表现 */
iframe{
	display:block;
}

/* 清理浮动 */
.clearfix:after {
	visibility:hidden;
	display:block;
	font-size:0;
	content:" ";
	clear:both;
	height:0;
}
.clearfix {
	zoom:1; /* for IE6 IE7 */
}
.fn-hide {
	display:none;
}/** 
 * Self CMS公共样式
 */

body { background: #fff;*position:relative; overflow-x:hidden;}
a { color:#000; }
a:hover { color:#000; text-decoration: none !important; }

/*常用功能class*/
.fl { float:left !important; }
.fr { float:right !important; }
.mb10 { margin-bottom:10px; }
.mt10 { margin-top:10px; }
.mt30 { margin-top:30px; }
.por { position: relative; }
.poa { position: absolute; }
.ti-999 { text-indent: -999em; }
:root .txt { line-height:normal !important; }
:focus { outline: none; }

/*通用广告*/
.ad-1000x120{ margin-top:20px;}
.ad-680x120 { margin-top:20px; float:left }
.ad-300x250 { margin-bottom:10px; }
.ad-300x250 img{ border: none;} 
.ad-300x250 a:hover img{ border: none;} 
.ad-300x600 img{ border: none;} 
.ad-300x600 a:hover img{ border: none;} 
.ad-300x120 { margin-top:20px; margin-bottom:10px; }
.ad-300x120 img{ border: none;} 
.ad-300x120 a:hover img{ border: none;} 
.ad-header > div, .ad-header > iframe, .ad-header .cnc_xg_div { margin-bottom: 10px; *margin-bottom: -5px;}

/*通用包装器*/
.wrapper { width:100%; overflow: hidden;}
.inner-wrapper { width: 1000px; margin: 0 auto; background-color: #FFF; }
.section { width: 1000px; margin:0 auto; margin-top:20px; }
.section .main { float:left; width: 680px; }
.section .aside { float:right; width: 300px; }

/* @start 导航 */
.nav-top { position: relative; z-index: 9; height: 30px; padding: 0 18px 0 19px; line-height: 30px; background: #e5e5e5;}
.nav-top .breadcrumbs, .nav-top .breadcrumbs li { float: left; margin-right: 16px;}
.nav-top .breadcrumbs a { color: #777;}
.nav-top .breadcrumbs .subscibe { color: #c30064;}
.nav-top .login-info { float: right;}
.nav-top .after-login { float: none;}
.nav-top .login-info a { margin-left: 16px; color: #000;}
.nav-top .logout-info { position: relative; float: right; height: 30px;}
.nav-top .logout-info .item { float: left; margin-left: 21px; margin-top: 0; background: none;}
.nav-top .logout-info .toggle-user { position: relative; display: inline-block; width: 81px; height: 29px; margin-top: 1px; padding-right: 9px; text-align: center; color: #c3c2c2; background: #fff url(../images/v2/logout-info-expand.png) right center no-repeat; cursor: pointer;}
.nav-top .logout-info .toggle-user a { margin-left: 0;}
.nav-top .logout-info .toggle-user .toggle-btn { display: inline-block; height: 28px; width: 69px; overflow: hidden;}
.nav-top .logout-info .toggle-user:hover, .nav-top .logout-info .toggle-user.active { background: #ff6d6e url(../images/v2/logout-info-expand-white.png) right center no-repeat;}
.nav-top .logout-info .toggle-user:hover a, .nav-top .logout-info .toggle-user.active a { color: #fff;}
.nav-top .logout-info .toggle-user:hover .toggle-btn, .nav-top .logout-info .toggle-user.active .toggle-btn { color: #fff; background: #ff6d6e;}
.nav-top .logout-info .toggle-user a { color: #c3c2c2; background: #fff;}
.nav-top .logout-info .toggle-user a:hover { text-decoration: none; color: #fff; background: #ff6d6e;}
.nav-top .logout-info .toggle-user ul { position: absolute; right: -1px; top: 29px; width: 135px; border: 1px solid #e5e5e5; border-width: 0 1px; font-size: 14px;}
.nav-top .logout-info .toggle-user .fn-hide li a { display: block; height: 40px; border-bottom: 1px solid #e5e5e5; line-height: 40px; text-align: center; color: #c3c2c2;}
.nav-top .logout-info .toggle-user .fn-hide li a:hover { color: #fff; border-color: #f15253;}
.nav-top .logout-info .message { position: relative; padding-right: 16px;}
.nav-top .logout-info .message span { display: none; position: absolute; right: 0; top: 0; width: 16px; height: 16px; font-size: 10px; line-height: 16px; text-align: center; color: #fff; background: url(../images/v2/message-bg.png) no-repeat;}
.nav-top .search { display: inline; float: right; width: 169px; height: 22px; margin: 4px 38px 0 0; background: #bfbfbf;}
.nav-top .search-btn { float: left; width: 24px; height: 16px; margin-top: 3px; border: none; background: url(../images/v2/nav-top-search.gif) no-repeat; cursor: pointer;}
.nav-top .search-input { float: left; width: 137px; height: 16px; margin-top: 3px; padding: 0 3px; border: none; border-right: 1px solid #686868; border-radius: 0; line-height: 16px; background: none;}

.index-nav .logo { left: 2px; top: 2px; width: 325px; height: 70px; background: url(../images/v2/logo-main.png) no-repeat;}
.index-nav .main { width: auto; margin: 0; margin-left: 350px;}
.index-nav .main li { float: left; height: 74px; background: url(../images/v2/nav-main-list-bg.gif) 0 center no-repeat; width:90px; text-align:center;}
.index-nav .main li .p1 { float: left; width: 3em; font-size: 18px; line-height: 74px; white-space: nowrap;}
.index-nav .main li .p2 { float: left; width: 6em; margin-left: 5px; padding-top: 15px; line-height: 24px;}
.index-nav .main li .p2 a { display: inline-block; margin-right: 1em; color: #c0c0c0;}
.index-nav .main li .len5 { width: 12em;}
.index-nav .main li .len5 a { width: 5em;}
.index-nav .main .list-beauty a:hover { color: #f17198;}
.index-nav .main .list-fashion a:hover { color: #785b92;}
.index-nav .main .list-life a:hover { color: #2ba5ce;}
.index-nav .main .list-explore a:hover { color: #ffb400;}
.index-nav .main .list-cosmetics a:hover { color: #ff9d82;}

.header { position: relative; z-index: 99;}
.header .nav { position: relative; *position: relative !important; top: -1px; width: 1000px; height: 75px; margin-bottom: -1px; background: url(../images/v2/nav-main-bgr.gif);}
.header .nav a { color: #fff;}
.header .nav .toggle-btn { position: absolute; z-index: 10; left: 90px; bottom: 0; width: 44px; height: 24px; background: url(../images/v2/nav-main-expand.png) center no-repeat; -webkit-transition: -webkit-transform .2s ease-out;}
.header .nav .toggle-btn.active, .header .nav .toggle-nav:hover .toggle-btn { -webkit-transform:rotate(180deg); }
.header .sub { position: absolute; left: 0; top: 74px;}
.header .sub li:first-child a { border: none;}
.header .sub a { display: block; width: 197px; height: 37px; border-top: 1px solid #000; line-height: 37px; text-align: center; color: #7d7c7c; background: rgba(29,29,29,.8); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#CC1D1D1D",endColorstr="#CC1D1D1D");}
.header .sub a:hover, .header .sub a.active { text-decoration: none; color: #fff;}
.header .logo { position: absolute; text-indent: -9999px;}
.header .logo a { display: block; height: 100%;}

.crumb-nav { height:30px;padding-left:10px;margin-top:10px; color:#666666;}
.crumb-nav a {  margin-left:5px; margin-right:5px; color:#666666;}

.newFloatTip { position: fixed; _position: absolute; bottom: 0; right: 0; z-index: 999; width: 80px;}
.newFloatTip .item, .newFloatTip .item a { display: block; margin-bottom: -1px; cursor: pointer; position:relative; width: 80px; height: 80px; background: url(../images/v2/float-icons.png) no-repeat;}
.newFloatTip .item { margin-top: 0; padding-left: 0;}
.newFloatTip .item a { display:none; position:absolute; left: -80px; top:0; cursor: pointer;}
.newFloatTip .share { background-position: right -102px;}
.newFloatTip .share:hover { background-position: -158px -102px;}
.newFloatTip .share .wx { left: -160px; background-position: 0 -102px;}
.newFloatTip .share .wx:hover { background-position: 0 0;}
.newFloatTip .share .sina { background-position: -80px -102px;}
.newFloatTip .share .sina:hover { background-position: -80px 0;}
.newFloatTip .weixin { background-position: right -181px;}
.newFloatTip .weixin a { left: -158px; background: none; cursor: default;}
.newFloatTip .weixin a img { width: 158px; height: 158px;}
.newFloatTip .weixin:hover { background-position: -158px -181px;}
.newFloatTip .returnTop { opacity: 0; background-position: right -260px; cursor: default;}
.newFloatTip .returnTop:hover { background-position: -158px -260px;}
.newFloatTip .subscibe { background-position: right 0;}
.newFloatTip .subscibe:hover { background-position: -179px 0;}
/* @end 导航 */

/* @start 底部 */
.common-bottom { margin-bottom: -30px; background: url(../images/v2/bottom-bgr.gif) repeat-x; zoom: 1;}
.common-bottom .inner-wrapper { position: relative; height: 474px; overflow: hidden; background: none;}
.common-bottom h3 { position: relative; width: 448px; height: 85px; margin: 0 auto; background: url(../images/v2/bottom-title.gif) no-repeat;}
.common-bottom h3 a { position: absolute; height: 32px; left: 0; bottom: 0; text-indent: -9999px;}
.common-bottom h3 .a2 { width: 149px;}
.common-bottom h3 .a1 { left: 149px; width: 141px;}
.common-bottom h3 .a3 { left: 290px; width: 159px;}
.common-bottom .intro { position: absolute; right: 5px; top: 163px; width: 200px; font-size: 14px; line-height: 30px; color: #fff;}
.common-bottom .intro .qrcode { margin-top: 19px; text-align: right;}
.common-bottom .intro .qrcode img { width: 91px; height: 91px;}
.common-bottom .imgs a { position: absolute;}
.common-bottom .imgs a em { display: none; position: absolute; background: #000; opacity: .5; filter: alpha(opacity=50);}
.common-bottom .imgs .img1 { left: 290px; top: 100px; width: 465px; height: 359px; background: url(../images/v2/bottom-img1-bg.png) no-repeat;}
.common-bottom .imgs .img1 img { margin: 39px 0 0 44px;}
.common-bottom .imgs .img1 em { left: 44px; top: 39px; width: 376px; height: 282px;}
.common-bottom .imgs .img1 span { position: absolute; right: 10px; top: 6px; width: 197px; height: 347px; background: url(../images/v2/bottom-img-gloss.png) no-repeat;}
.common-bottom .imgs .img2 { left: 45px; top: 120px; width: 293px; height: 359px; background: url(../images/v2/bottom-img2-bg.png) no-repeat;}
.common-bottom .imgs .img2 img { margin: 16px 0 0 18px;}
.common-bottom .imgs .img2 em { left: 15px; top: 13px; width: 263px; height: 348px;}
.common-bottom .imgs .img3 { left: 630px; top: 281px; width: 119px; height: 248px; background: url(../images/v2/bottom-img3-bg.png) no-repeat;}
.common-bottom .imgs .img3 img { margin: 34px 0 0 9px;}
.common-bottom .imgs .img3 em { left: 9px; top: 34px; width: 101px; height: 178px;}
/* @end 底部 */

/*footer*/
.site-info{ background:#2b2e31; border-top:5px solid #af2222; height:180px; margin-top:30px;}
.site-info .condenast-nav{ height:35px; padding:23px 28px 0 28px; border-bottom:1px solid #393a3c;}
.site-info .condenast-nav .cn-logo{display:block; width:105px; height:27px; float:left; background-position:0 -63px;}
.site-info  p{ color:#fff;font-size:14px; float:left; display:inline; }
.site-info  p a{ color:#fff; display:inline-block; margin-left:7px; margin-right:7px;}
.site-info  p a:hover { color: #fff;}
.site-info  p span{ color:#7c7d7d;}

.site-info .footer-nav{height:110px; padding:10px 0 0 0;}
.site-info .footer-nav .self-logo{display:block; width:133px; height:27px; float:left; background: url(../images/v2/footer.png) 0 -93px no-repeat;}
.site-info .footer-nav p{margin-left:10px; /*width:780px;*/ margin-top:8px;}
.site-info .footer-nav .copyright{ /*width:410px;*/ margin:10px auto; line-height:18px; color:#959798; text-align:center; font-size:12px;}
.site-info .footer-nav .copyright a{ color:#959798;}

.site-info { border-width: 10px;}
.site-info .inner-wrapper { background: none;}
/*mini-headfoot*/
.mini-nav{ height:40px; background:#000; overflow: hidden;}
.mini-nav .logo{float:left; display:block;}
.mini-nav ul{ float:left; height:16px; line-height:16px; margin-top:12px; }
.mini-nav ul li{ float:left;height:16px; padding:0 6px; border-right:1px solid #333333; }
.mini-nav ul li.last{ border-right:none;}
.mini-nav ul li a{ color: #e7e6e6;}
.mini-nav ul li a:hover{ color: #e7e6e6;}
.mini-nav .topinfo { float: right; margin-right:3px;margin-top:12px; color:#e7e6e6;}
.mini-nav .topinfo .login-info a{ color:#e7e6e6; margin-right:5px; margin-left:5px;}
.mini-nav .topinfo .login-info a{color:#e7e6e6;margin-left:3px; margin-right:3px;}
.mini-nav .topinfo .login-info a.qq{ display:inline-block;width:54px; height:16px; margin-left:3px; margin-right:3px; padding:0; /*background:url(../images/qq.png) no-repeat;*/ vertical-align:text-bottom;}
.mini-nav .topinfo .login-info a.sina{  display:inline-block;width:54px; height:16px;margin-right:3px; padding:0;/*background:url(../images/sina.png) no-repeat left center;*/vertical-align:text-bottom;}
.mini-nav .topinfo span{ color:#333}

/*右侧手机推广模块*/
.ad-mobile{ margin-bottom:10px; /*background:url(../images/moblie/mobile-bg.jpg) no-repeat;*/ height:240px;}
.ad-mobile a.ad-mobile-btn{ display:block; float:left; width:126px; height:47px; margin-top:144px; margin-left:27px; _display:inline}
.ad-mobile-slide{ float:left; width:97px; height:146px; margin-top:47px; margin-left:23px; overflow:hidden; position:relative; _display:inline}
.ad-mobile-slide ul{ position:absolute;}
.ad-mobile-slide li{ float:left;width:97px; height:146px; display:block;}
.ad-mobile-slide li a img{ border:none}
.ad-mobile-slide li a:hover img{ border:none}

/*右侧杂志应用模块*/
.ipad-product .img-wrap { position:relative; } 
.ipad-product .img-wrap span { position:absolute; text-indent:-999em;}
.ipad-product .img-wrap img, .ipad-product .img-wrap a:hover img, .ipad-product ul.clearfix img, .ipad-product ul.clearfix a:hover img  { border:none;}
.ipad-product .tac { height:49px; text-align:center;}
.ipad-product .tac a { display:inline-block; width:154px; height:49px; /*background:url(../images/ipad-btn-appstore.png) no-repeat;*/}
.ipad-product .tac a span { display:none;}
.ipad-product ul { font-size:16px; line-height:19px; text-align:center;}
.ipad-product li { display:inline; float:left;}
.ipad-product li .caption { display:block; margin-top:10px;}

.ipad-self { width:298px; margin-bottom:10px;margin-top:10px; padding-bottom:25px; border:solid 1px #ddd; overflow:hidden}
.ipad-self h2 { height:41px; border-bottom:solid 1px #ddd; text-indent:-999em; /*background:url(../images/ipad-self-title.png) 27px 9px no-repeat;*/}
.ipad-self .img-wrap { padding:69px 0 38px 39px; /*background: url(../images/ipad-self.png) no-repeat 24px 54px;*/}
.ipad-self .img-wrap span { right:0; top:-1px; width:114px; height:115px; /*background:url(../images/ipad-self-deco.png) no-repeat;*/}
.ipad-self .more-products { height:41px; border-bottom:solid 1px #ddd; font-size:14px; line-height:41px;}
.ipad-self .more-products span { position:relative; top:21px; display:inline-block; width:145px; text-align:center; background:#fff;}
.ipad-self ul { margin-top:31px; padding-left:15px;}
.ipad-self li { width:5em; margin:0 20px 0 31px;}

/*奥妙logo*/
.OMO{width: 133px;height: 144px;float: right;}
.new-icon{ display: block; position: absolute; width: 22px; height: 9px; left: 18px; top: 3px; /*background: url(../images/new.png) no-repeat;*/}
.try-tip{ display: none; }

/*微信二维码*/
.floatTip{position:fixed;_position:absolute; /* left:50%;margin-left:516px; */ height: 220px;bottom:10px; right: 10px; z-index: 9999; width: 80px;}
.floatTip .weixin{width:78px; border: 1px solid #d9d9d9; /*background: url(../images/png-floatTip.png) repeat;*/ text-align: center;margin-bottom: 6px;}
.floatTip .weixin-title{display:inline-block; padding: 12px 0; line-height: 18px;color: #000;font-weight: bold;}
.floatTip .weixin-img{ height: 72px; position: relative;}
.floatTip .weixin-pic{ cursor:pointer;}
.floatTip .weixin .weixin-pop{position: absolute; bottom:-2px; left:-131px;width: 125px; height: 125px; padding-right: 10px;display: none;}
.floatTip .weixin .weixin-pop img{ width: 117px; height: 117px; padding: 3px; background: #fff; border: 1px solid #363636;}

/* @start 面包屑导航*/
.gallery-crumb{ height: 38px; line-height: 38px; color: #9fa0a0;}
.gallery-crumb a, .gallery-crumb span{ color: #9fa0a0; margin-right: 8px;}
/* @end 面包屑导航*/

/*产品相关栏目顶部*/
#brand-header .special-nav-wrap { height: 40px; background: url(../images/v2/nav-main-bgr.gif); padding-top:10px; width: 100%; min-width: 1000px;}
#brand-header a { color: #fff; text-decoration: none;}
#brand-header a:hover {color: #ff9d82;}
#brand-header .special-nav { width:978px; margin: 0 auto; padding-left:22px;}
#brand-header .special-nav .logo { background: url(../images/v2/zt-logo.png) no-repeat left top; display: block; width: 164px; height:35px; float: left;text-indent: -9999px;}
#brand-header .special-nav ul { width: 650px; float:left; height: 32px; background: url(../images/v2/nav-main-list-bg.gif) left center no-repeat; margin-left:15px;}
#brand-header .special-nav ul li { padding: 0 16px;background: url(../images/v2/nav-main-list-bg.gif) right center no-repeat;  height: 32px; line-height: 32px; float: left; font-size: 14px;}
#brand-header .special-nav ul li.last { background: none;}
#brand-header .top-login { float: right; line-height: 36px;}
#brand-header .top-login a { margin-right:12px;}
#brand-header .top-login a:hover { color: #fff;}

.MoTuADPng{
 	position: absolute;
 	z-index: -1;
 	top: 0;
 	left: 0;
 }
.AspNetPager a{border:1px solid #D7D7D7; padding:5px 10px 5px 10px;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px;}
.AspNetPager a:hover {border:1px solid #857C7A; padding:5px 10px 5px 10px; background-color:#00A3D9; color:#fff;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px;}


.AspNetPager a{border:1px solid #D7D7D7; padding:5px 10px 5px 10px;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px;}
.AspNetPager a:hover {border:1px solid #857C7A; padding:5px 10px 5px 10px; background-color:#857C7A; color:#fff;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px;}


.AspNetPager {text-align:center; padding:20px 5px 10px 5px; clear:both;}
.AspNetPager input{border:1px solid #D7D7D7;padding:0px 2px 0 2px !important;padding:2px 0px 0 0px;  background-color:#FFFFFF; cursor:pointer; width:inherit;font-size:12px; }
.AspNetPager span{border:1px solid #665B59; padding:5px 10px 5px 10px;background-color:#665B59; color:#fff;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px;}
.AspNetPager .cpb{border:1px solid #665B59; padding:5px 10px 5px 10px;background-color:#665B59; color:#fff;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px;}