@charset "utf-8";
/*
	EEPW官网：www.eepw.com.cn
	技术交流：forum.eepw.com.cn
*/


/* reset */
body,h1,h2,h3,h4,h5,p,dl,dd,ul,ol,form,input,textarea,th,td,select { margin:0; padding:0; }
em { font-style:normal; }
li { list-style:none; }
a { text-decoration:none; color:#333; }
a:hover{color:#c00;}
img { border:none; vertical-align:top; }
table { border-collapse:collapse; }
input,textarea { outline:none; }
textarea { resize:none; overflow:auto; }
body { font-size:12px; font-family:"微软雅黑","宋体","Arial"; }
/* end reset */

/* public */
.clear { zoom:1; }
.clear:after { content:''; display:block; clear:both; }
.fl { float:left; }
.fr { float:right; }
.gradient {
	background:-moz-linear-gradient(top, #FFFFFF, #f8f8f8);
	background:-webkit-linear-gradient(top, #FFFFFF, #f8f8f8);
	background:-ms-linear-gradient(top, #FFFFFF, #f8f8f8);
	background:linear-gradient(top, #FFFFFF, #f8f8f8);
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#FFFFFF, endColorstr=#f8f8f8)";
	+background:#f9f9f9;
}
.triangle_up, .triangle_down_red, .triangle_down_gray { position:absolute; width:0; height:0; overflow:hidden; border-left:4px solid transparent; border-right:4px solid transparent; }
.triangle_up { border-bottom:4px solid #ca0309; }
.triangle_down_red { border-top:4px solid #ca0309; }
.triangle_down_gray { border-top:4px solid #c4bdbd; }
/* end public */

/* layout */
#logoSearchNews,#top .inner,#techSubSta{margin:0 auto;width:1160px;}
#top{position:relative;height:40px;line-height:40px;background:#F4F4F4;border-top:solid 3px #B50000;border-bottom:solid 1px #EDEEF0;
z-index:999;}
.inner{background:#f4f4f4; border-top:#b50000 solid 3px; position:relative; top:-3px;}
#logoSearchNews{position:relative;margin-top:10px;height:88px;z-index:100;}
nav{height:43px;position:relative;z-index:99;background:#B50000;}
#techSubSta{width:1018px;border:solid 1px #DDDDDD;background:#F7F7F7;}
/* end layout */

/* top begin */
#top .inner a{color:#4C4C4C;font-size: 12px;}
#top .inner a:hover{color:#039;}
.mobMagDes{float:left;}
.tools,.logReg{float:right;}
#onlineTools{width:86px;z-index:2;}
.mobMagDes li{float:left;margin-right:28px;}
.fred{color:#c00;}

/* top - 移动客户端 */
.mob{position:relative;padding-left:20px;}
.mobIcon{position:absolute;left:0;top:12px;width:11px;height:16px;perspective:11px;-webkit-perspective:11px;perspective-origin:center center;-webkit-perspective-origin:center center;overflow:hidden;}
.mobIcon span{position:absolute;width:11px;height:16px;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transform-origin:center center -5.5px;-webkit-transform-origin:center center -5.5px;transition:.6s;
-moz-transition:.6s;-webkit-transition:.6s;-o-transition:.6s;}
.mob span img{position:absolute;}
.mobIcon .icon1{left:0;top:0}
.mobIcon .icon2{left:11px;top:0;-webkit-transform-origin:left;-webkit-transform:rotateY(90deg);}
.mob:hover .mobIcon span{ -webkit-transform:rotateY(-90deg);}

/* top - EEPW《设计100例》*/
.foldingBox{position:relative;width:126px;cursor:pointer;z-index:3;background:#F4F4F4;}
.foldingBox img{position:absolute;z-index:1;right:0;top:18px;
-moz-transition:0.5s;
-webkit-transition:0.5s;
-o-transition:0.5s;
transition:0.5s;
}

/* top - 移动客户端 begin */
.logReg{padding-right:30px;}
.logReg li{float:left;margin-left:28px;}

.tools li{display:inline;float:left;margin-left:12px;color:#CCC;}
.foldingBox:hover{background:#CCC;}

.foldingBox:hover img{
-ms-transform:rotate(180deg); 	/* IE 9 */
	-moz-transform:rotate(180deg); 	/* Firefox */
	-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
	-o-transform:rotate(180deg); 
	transform:rotate(180deg);
}

@keyframes open{
	0%
	{
		-webkit-transform:rotateX(-120deg);
	}	
	40%
	{
		-webkit-transform:rotateX(30deg);
	}
	60%
	{
		-webkit-transform:rotateX(-20deg);
	}
	80%
	{
		-webkit-transform:rotateX(10deg);
	}
	100%
	{
		-webkit-transform:rotateX(0deg);
	}
}
@-moz-keyframes open{
	0%
	{
		-webkit-transform:rotateX(-120deg);
	}	
	40%
	{
		-webkit-transform:rotateX(30deg);
	}
	60%
	{
		-webkit-transform:rotateX(-20deg);
	}
	80%
	{
		-webkit-transform:rotateX(10deg);
	}
	100%
	{
		-webkit-transform:rotateX(0deg);
	}
}
@-webkit-keyframes open{
	0%
	{
		-webkit-transform:rotateX(-120deg);
	}	
	40%
	{
		-webkit-transform:rotateX(30deg);
	}
	60%
	{
		-webkit-transform:rotateX(-20deg);
	}
	80%
	{
		-webkit-transform:rotateX(10deg);
	}
	100%
	{
		-webkit-transform:rotateX(0deg);
	}
}
@-o-keyframes open{
	0%
	{
		-webkit-transform:rotateX(-120deg);
	}	
	40%
	{
		-webkit-transform:rotateX(30deg);
	}
	60%
	{
		-webkit-transform:rotateX(-20deg);
	}
	80%
	{
		-webkit-transform:rotateX(10deg);
	}
	100%
	{
		-webkit-transform:rotateX(0deg);
	}
}

/* 折纸 */
.paperFolding{position:relative;perspective:800px;-webkit-perspective:800px;}
.paperFolding .arrow{position:absolute;right:0;top:12px;}
.paperFolding .menu{width:100%;display:none;}
.paperFolding h4{position:relative;height:40px;background:#F4F4F4;text-align:left;font:16px/40px;font-weight:normal;color:#666;font-size:12px; z-index:2;transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;-o-transition:.5s;}
.paperFolding div{position:absolute;width:100%;top:31px;left:0;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transform-origin:top;-webkit-transform-origin:top;transform:rotateX(-120deg);-ms-transform:rotateX(-120deg);
-moz-transform:rotateX(-120deg);-webkit-transform:rotateX(-120deg);-o-transform:rotateX(-120deg);transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;-o-transition:.5s;}
.paperFolding > div{top:40px;}
.paperFolding .open{animation:open 1.5s;-moz-animation:open 1.5s;-webkit-animation:open 1.5s;-o-animation:open 1.5s;transform:rotateX(0deg);-ms-transform:rotateX(0deg);-moz-transform:rotateX(0deg);-webkit-transform:rotateX(0deg);-o-transform:rotateX(0deg);}
.paperFolding span{display:block;height:30px;line-height:30px;border-bottom:solid 1px #FFF; font:14px/30px;background:#DADADA;text-indent:15px;transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;-o-transition:.5s;box-shadow:inset 0 0 30px 20px rgba(0,0,0,1);}
.paperFolding .open>span{box-shadow:inset 0 0 30px 10px rgba(0,0,0,0);}
.paperFolding span:hover{ background:#C1C1C1;text-indent:30px;}

/* logo */
.logo { position:0 0px;width:240px; height:75px; overflow:hidden;}
.logo h1 a {display:block; width:240px; height:75px;}

/* search */
.search{position:absolute;left:340px;top:18px;width:420px;height:100%;color:#666;}
.search .input{position:absolute;left:76px;padding-left:14px;width:244px;height:33px;line-height:33px;border:solid 1px #C1C1C1;border-left:none;color:#666;}
.search .btn{position:absolute;left:310px;width:66px;height:35px;background:#B50000;border:none;background:#B50000 url(../images/magnifier_icon_14x15.png) 26px 11px no-repeat;cursor:pointer;}
.search .btn:hover{
-khtml-box-shadow:0 0px 10px #DA7F7F;
-rim-box-shadow:0 0px 10px #DA7F7F;
-ms-box-shadow:0 0px 10px #DA7F7F;
-o-box-shadow:0 0px 10px #DA7F7F;
-moz-box-shadow:0 0px 10px #DA7F7F;
-webkit-box-shadow:0 0px 10px #DA7F7F;
box-shadow:0 0px 10px #DA7F7F;
}
.search .type{
	position:absolute;
	left:1px;
	width:74px;
	height:33px;
	border:solid 1px #C1C1C1;
	cursor:pointer;
}
.search .type img{position:absolute;right:10px;top:15px;
-moz-transition:0.5s;
-webkit-transition:0.5s;
-o-transition:0.5s;
transition:0.5s;}
.search .type:hover img{
-ms-transform:rotate(180deg); 
-moz-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
-o-transform:rotate(180deg); 
transform:rotate(180deg);}
.search .type ul{position:absolute;top:33px;left:-1px;width:74px;border:solid 1px #C1C1C1;border-top:none;border-bottom:none;background:#FFF;display:none;z-index: 100;}
.search .type ul li{height:30px;line-height:30px;text-indent:15px;border-bottom:solid 1px #D0D0D0;}
.search .type ul li:hover{background:#F7E5E5;color:#B50000;}
.search .type h4{font-size:14px;line-height:33px;text-indent:15px;}
.search .keywordnew{position:absolute; top:35px; font-size:12px; line-height:23px; padding-left:5px;}
.search .keywordnew a{color:#666;}
.search .keywordnew a:hover{color:#c00;}
.adtop{position: absolute;right: 0;top: 0px;width: 350px;height: 80px;overflow: hidden;}
.adtop h3{font-size:14px; color:#333; font-weight:normal; line-height:23px;}

/* 导航 */
nav ul{position:relative;margin:0;padding:0;width:1080px;/*_width:1036px;*/}
nav li{list-style:none;}
nav .box{margin:0 auto;width:1160px;/*_position:relative;*/background:#B50000;}
nav .box li{float:left;margin-right:5px;width:94px;height:43px;line-height:43px;text-align:center;font-size:12px;cursor:pointer;}
nav .box li.mask{position:absolute;left:0;top:0;overflow:hidden;}
nav .box .tecgroupCon li {
    width: 124px;
}
nav .box li.mask a{color:#FEDDB8;}
nav .box li.mask ul{position:absolute;left:0;background:#9E0B0E;}
nav .clear{zoom:1;}
nav .clear:after{content:'';display:block;clear:both;}
nav a {color:#FFF;font-size:16px;}
nav a:hover{color:#FFF;font-size:16px;}
.techExch .activeArrow,.interCommu .activeArrow,.tecgroup .activeArrow,.moregroup .activeArrow{position:absolute;left:866px;top:20px;
-moz-transition:0.5s;
-webkit-transition:0.5s;
-o-transition:0.5s;
transition:0.5s;
}
.interCommu .activeArrow{left:972px;}
.tecgroup .activeArrow{left:280px;}
.moregroup .activeArrow{left: 1054px;}
.techExch:hover .activeArrow,.interCommu:hover .activeArrow,.tecgroup:hover .activeArrow,.moregroup .activeArrow:hover{
-ms-transform:rotate(180deg); 
-moz-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
-o-transform:rotate(180deg); 
transform:rotate(180deg);
}
.techExchCon,.interCommuCon,.tecgroupCon,.moregroupCon{position:absolute;left:0px;top:43px;
background: #ffffff; padding:30px 50px;width:1060px;height:auto;display:none;
    border: 1px solid #cdcdcd;
    -webkit-box-shadow: 0 0 8px #cdcdcd;
    -moz-box-shadow: 0 0 8px #cdcdcd;
    box-shadow: 0 0 8px #cdcdcd;
   }

.techExchCon img{position:static;}
.techExchCon li:hover img{-webkit-transform:scale(1.2)}
nav .cLogo li{float: left;margin-right:5px;
margin-bottom: 10px;

width:126px;
height: auto;
text-align: left;overflow:hidden;cursor:pointer;}

nav .cLogo img{width: 120px;height:42px;}
nav .cLogo em{display:block;width:120px;height:42px;border:solid 1px #CCC;/*-webkit-box-reflect: below 2px -webkit-linear-gradient(bottom,rgba(0,0,0,0.2) 0,rgba(0,0,0,0) 50%);*/}
nav .cLogo span {
display: block;
padding-top:5px;
height: 20px;
line-height: 20px;
font-weight: normal;
color: #3d3d3d;
font-size: 12px;
text-align:center;
}

nav .cTxt li{
text-align: left;
height: 28px;
line-height: 28px;
width: 128px;
font-size:14px;
font-weight:normal;

}
nav .hdsq li{
text-align: left;
height: 28px;
padding-top: 10px;
width: 175px;
color: #000;
font-size:14px;
font-weight:normal;	
}
nav .hdsq li a{color: #000000;}
nav .hdsq li a:hover{color:#9E0B0E;}
nav .hdsq li img{
margin-right:10px;
padding: 4px;
background:#fff;
width: 30px;
height: 30px;
-webkit-border-radius: 50%;
-webkit-transition: 1s;
-moz-border-radius: 50%;
-moz-transition: 1s;
-o-border-radius: 50%;
-o-transition: 1s;
-khtml-border-radius: 50%;
-khtml-transition: 1s;
-ms-border-radius: 50%;
-ms-transition: 1s;
-rm-border-radius: 50%;
-rm-transition: 1s;
border-radius: 50%;
transition: 1s;
border:solid 1px #CCC;
-webkit-box-reflect: below 2px -webkit-linear-gradient(bottom,rgba(0,0,0,0.2) 0,rgba(0,0,0,0) 50%);
}
nav .interCommuCon span {width:42px;height:42px;float:left;margin-right:5px;}
nav .cTxt li a{font-size:12px;font-weight:normal;color:#000000;}
nav .cTxt li a:hover{color:#9E0B0E}
.interCommuCon{height:60px;} 

/* 新增 */ nav .box li.menu:hover{background:#9E0B0E;}
.tecgroupCon li,.moregroupCon li{height: 30px;line-height: 30px;}
.tecgroupCon a,.moregroupCon a{font-size:16px;font-weight:normal;color:#000000;display: block;}
.tecgroupCon a:hover,.moregroupCon a:hover{font-size:16px;font-weight:normal;color:#ffffff;background:#9E0B0E;}
nav .box .moregroupCon li{width: auto;}
nav .box .moregroupCon li a{display: block;padding: 0px 15px;}