@charset "utf-8";

.list:before,.list:after { content:""; position:absolute; z-index:0; transition:all .5s ease; z-index:1; }

.IMG_List_1 div.list { width:100%; height:auto; display:inline; float:left; position:relative; box-sizing:border-box; }

.IMG_List_2 .list { width:calc(95%/2); display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_2 .list + .list:nth-child(n+2) { margin-top:3%; }
.IMG_List_2 .list + .list:nth-child(-n+2) { margin-top:0; }
.IMG_List_2 .list + .list:nth-child(even) { margin-left:5%; }
.IMG_List_2 .list + .list:nth-child(odd) { clear:both; }


.IMG_List_3 .list { width:calc(90%/3); display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_3 .list + .list { margin-left:5%; }
.IMG_List_3 .list + .list:nth-child(3n+1) { margin-left:0; clear:both; }
.IMG_List_3 .list + .list:nth-child(n+3) { margin-top:1.5%; }
.IMG_List_3 .list + .list:nth-child(-n+3) { margin-top:0; }

#Body_Main .IMG_List_3 .list { width:calc(97%/3); }
#Body_Main .IMG_List_3 .list + .list { margin-left:1.5%; }
#Body_Main .IMG_List_3 .list + .list:nth-child(3n+1) { margin-left:0; clear:both; }


.IMG_List_4 .list { width:calc(92%/4); display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_4 .list + .list { margin-left:calc(8%/3); }
.IMG_List_4 .list + .list:nth-child(4n+1) { margin-left:0; clear:both; }
.IMG_List_4 .list + .list:nth-child(n+4) { margin-top:.8%; }
.IMG_List_4 .list + .list:nth-child(-n+4) { margin-top:0; }

#Body_Main .IMG_List_4 .list { width:calc(95.5%/4); }
#Body_Main .IMG_List_4 .list + .list { margin-left:1.5%; }
#Body_Main .IMG_List_4 .list + .list:nth-child(4n+1) { margin-left:0; clear:both; }


.IMG_List_5 .list { width:calc(98%/5); display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_5 .list + .list { margin-left:.5%; }
.IMG_List_5 .list + .list:nth-child(5n+1) { margin-left:0; clear:both; }
.IMG_List_5 .list + .list:nth-child(n+5) { margin-top:.5%; }
.IMG_List_5 .list + .list:nth-child(-n+5) { margin-top:0; }

.IMG_List_6 .list { width:calc(98%/6); display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_6 .list + .list { margin-left:.4%; }
.IMG_List_6 .list + .list:nth-child(6n+1) { margin-left:0; clear:both; }
.IMG_List_6 .list + .list:nth-child(n+6) { margin-top:.4%; }
.IMG_List_6 .list + .list:nth-child(-n+6) { margin-top:0; }

.IMG_List_7 .list { width:calc(97.9%/7); display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_7 .list + .list { margin-left:.35%; }
.IMG_List_7 .list + .list:nth-child(7n+1) { margin-left:0; clear:both; }
.IMG_List_7 .list + .list:nth-child(n+7) { margin-top:.35%; }
.IMG_List_7 .list + .list:nth-child(-n+7) { margin-top:0; }

.IMG_List_8 .list { width:calc(98%/8); display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_8 .list + .list { margin-left:calc(2%/7); }
.IMG_List_8 .list + .list:nth-child(8n+1) { margin-left:0; clear:both; }
.IMG_List_8 .list + .list:nth-child(n+8) { margin-top:calc(2%/7); }
.IMG_List_8 .list + .list:nth-child(-n+8) { margin-top:0; }

.IMG_List_10 .list { width:calc(98%/10); display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_10 .list + .list { margin-left:calc(2%/9); }
.IMG_List_10 .list + .list:nth-child(10n+1) { margin-left:0; clear:both; }
.IMG_List_10 .list + .list:nth-child(n+10) { margin-top:calc(2%/9); }
.IMG_List_10 .list + .list:nth-child(-n+10) { margin-top:0; }


.KE_IMG_Show [class*="zoom"] { display:inline; float:left; position:relative; box-sizing:border-box; }
.IMG_List_2 .zoom { width:calc(100%/2); }
.IMG_List_3 .zoom { width:calc(100%/3); }
.IMG_List_4 .zoom { width:calc(100%/4); }
.IMG_List_5 .zoom { width:calc(100%/5); }


/* 产品列表样式设置 */
div.mask {
	width:100%; height:100%; opacity:0; filter:alpha(opacity=0); position:absolute; top:0; left:0; z-index:88;
	background:#000; background-repeat:no-repeat; background-position:center -50%;
}

div.mpg4 {
	width:100%; height:100%; opacity:.5; filter:alpha(opacity=50); position:absolute; top:0; left:0; z-index:88;
	background:#000; background-image:url(../images/mpg4.png); background-repeat:no-repeat; background-position:center center;
}


.KE_IMG_Show .XSales,.KE_IMG_Show .Moneys { width:100%;text-align:left; }
.KE_IMG_Show .Moneys { height:39px; font:normal bold 15pt/22px Arial, Helvetica; color:#D00; letter-spacing:-1px; padding:0; }
.KE_IMG_Show .Moneys span { font:normal bold 10pt/22px Arial,Helvetica; color:#D00; letter-spacing:-2px; }

.KE_IMG_Show label.Title,.KE_IMG_Show label.Title a { font-size:12pt; line-height:22px; }
.KE_IMG_Show label.Title { width:100%; height:48px; padding-top:12px; text-align:center; position:relative; }

.KE_IMG_Show label.Title.Author { height:55px; padding-top:5px; text-align:left; }
.KE_IMG_Show label.Title p.Author { width:100%; height:25px; display:inline-block; text-overflow:ellipsis; white-space:nowrap; }
.KE_IMG_Show label.Title p.Author { position:absolute; bottom:10px; left:0; }

.KE_IMG_Show ul.Zfloat { height:0; position:absolute; bottom:0; z-index:100; }
.KE_IMG_Show div:hover ul.Zfloat { height:48px; background:rgba(0,0,0,.6); color:#FFF; }
.KE_IMG_Show div:hover ul.Zfloat label.Title a { color:#FFF; }

/* -webkit-box-sizing:border-box; -moz-box-sizing:border-box; */
.KE_IMG_Show div.show { width:100%; height:0; margin:0; padding:0; position:relative; box-sizing:border-box; }
.KE_IMG_Show div.show img { width:100%; height:100%; position:absolute; top:0; left:0; }
.KE_IMG_Show.IMG_List_1 div.show { height:auto; margin:0; padding:0; float:left; }
.KE_IMG_Show.IMG_List_1 div.show img { height:auto; position:relative; left:0; }


div.Mold { width:18.8%; display:inline; float:left; position:relative; }
div.Mold + div.Mold { margin-right:1.5%; margin-top:1%; }
div.Mold + div.Mold:nth-child(-n+4) { margin-top:0; }
div.Mold + div.Mold:nth-child(5n+2) { margin-right:0; }
div.Mold + div.Mold:nth-child(2) { margin-right:1.5%; }
div.Mold + div.Mold:nth-child(4) { margin-right:0; }
div.Mold + div.Mold:nth-child(8) { clear:both; }

div.Mold:nth-child(1) { width:39.1%; margin-right:1.5%; float:left; }
.IMG_List_8 div.Mold:nth-child(1) { margin-left:1.5%; margin-right:0; float:right; }


div.Mini { width:19.6%; display:inline; float:left; position:relative; }
div.Mini + div.Mini { margin-right:.5%; margin-top:.5%; }
div.Mini + div.Mini:nth-child(-n+4) { margin-top:0; }
div.Mini + div.Mini:nth-child(5n+2) { margin-right:0; }
div.Mini + div.Mini:nth-child(2) { margin-right:.5%; }
div.Mini + div.Mini:nth-child(4) { margin-right:0; }
div.Mini + div.Mini:nth-child(8) { clear:both; }


div.Mini:nth-child(1) { width:39.7%; margin-right:.5%; float:left; position:relative; }
.IMG_List_16 div.Mini:nth-child(1) { margin-left:.5%; margin-right:0; float:right; }


div.Boxs { width:24.55%; display:inline; float:left; text-align:center; position:relative; }
div.Boxs + div.Boxs { margin-right:.6%; margin-top:.6%; }
div.Boxs + div.Boxs:nth-child(-n+3) { margin-top:0; }
div.Boxs + div.Boxs:nth-child(4n+1) { margin-right:0; }
div.Boxs + div.Boxs:nth-child(2) { margin-right:.6%; }
div.Boxs + div.Boxs:nth-child(3) { margin-right:0; }
div.Boxs + div.Boxs:nth-child(6) { clear:both; }

div.Boxs:nth-child(1),.IMG_List_14 div.Boxs + div.Boxs:nth-child(6) { width:49.7%; margin-right:.6%; float:left; position:relative; }
.IMG_List_14 div.Boxs:nth-child(1) { margin-left:.6%; margin-right:0; float:right; }
.IMG_List_14 div.Boxs + div.Boxs:nth-child(9),.IMG_List_14 div.Boxs + div.Boxs:nth-child(13) { margin-right:.6%; }
.IMG_List_14 div.Boxs + div.Boxs:nth-child(8) { margin-right:0; }
.IMG_List_14 div.Boxs + div.Boxs:nth-child(10) { margin-right:0; }
.IMG_List_14 div.Boxs + div.Boxs:nth-child(14) { margin-right:0; }


div.Eight { width:16.5%; display:inline; float:left; text-align:center; position:relative; }
div.Eight + div.Eight { margin-right:.2%; margin-top:.2%; }
div.Eight + div.Eight:nth-child(-n+5) { margin-top:0;  }
div.Eight + div.Eight:nth-child(6n+3) { margin-right:0; }
div.Eight + div.Eight:nth-child(3) { margin-right:.2%; }
div.Eight + div.Eight:nth-child(5) { margin-right:0; }
div.Eight + div.Eight:nth-child(10) { clear:both; }

div.Eight:nth-child(1) { width:33.2%; margin-right:0.2%; float:left; text-align:center; position:relative; }
.IMG_List_18 div.Eight:nth-child(1) { position:absolute; left:33.4%; float:left; }
.IMG_List_18 div.Eight + div.Eight:nth-child(4),.IMG_List_18 div.Eight + div.Eight:nth-child(8) { margin-left:33.4%!important; }
.IMG_List_19 div.Eight:nth-child(1) { margin-left:0.2%; margin-right:0%; float:right; }



/* 正方形 5:5 */
.AStyle div.show,.AStyle figure { padding-bottom:100%; }
.AStyle div.Mold:nth-child(1) div.show { padding-bottom:calc(100% + 54px); }


/* 宽横屏 4:3 */
.BStyle div.show,.BStyle figure { padding-bottom:75%; }
.BStyle .IMG_List_7 div.Mold:nth-child(1) div.show,.BStyle .IMG_List_8 div.Mold:nth-child(1) div.show { padding-bottom:calc(75% + 60px); }
.BStyle div.Zoom_E div.show,.BStyle div.Zoom_F div.show { padding-bottom:75%; }


/* 竖矩形 3:4 */
.CStyle div.show,.CStyle figure { padding-bottom:125%; }
.CStyle .IMG_List_7 div.Mold:nth-child(1) div.show,.CStyle .IMG_List_8 div.Mold:nth-child(1) div.show { padding-bottom:calc(123% + 60px); }
.CStyle div.Zoom_E div.show,.CStyle div.Zoom_F div.show { padding-bottom:124.7%; }


/* 横竖默认比例 9:6 */
.DStyle div.show,.DStyle figure { padding-bottom:66.6666%; }
.DStyle .IMG_List_7 div.Mold:nth-child(1) div.show,.DStyle .IMG_List_8 div.Mold:nth-child(1) div.show { padding-bottom:calc(66.6666% + 60px); }
.DStyle div.Eight:nth-child(1) div.show { padding-bottom:66.8%; }


/* 窄横屏 16:9 */
.FStyle div.show,.FStyle figure { padding-bottom:56.25%; }
.FStyle div.Mold_L div.show,.FStyle div.Mold_R div.show { padding-bottom:calc(56% + 60px); }
.FStyle div.Zoom_E div.show,.FStyle div.Zoom_F div.show { padding-bottom:56.5%; }

/*
#Body_Main .BStyle div.Zoom_C div.show,#Body_Main .BStyle div.Zoom_D div.show {  padding-bottom:78.2%; }
#Body_Main .CStyle div.Zoom_C div.show,#Body_Main .CStyle div.Zoom_D div.show {  padding-bottom:137.5%; }
#Body_Main .DStyle div.Zoom_C div.show,#Body_Main .DStyle div.Zoom_D div.show {  padding-bottom:81.5%; }
#Body_Main .FStyle div.Zoom_C div.show,#Body_Main .FStyle div.Zoom_D div.show {  padding-bottom:71.2%; }
*/


/* 横宽比样式 2:1 */
#Main_10 .list { padding:2px; border:0; box-sizing:border-box; }
#Main_10 label.Title { width:100%; height:48px; text-align:center; position:relative; }
#Main_10 label.Title,#Main_10 label.Title a { line-height:3; }

.EStyle div.show,.EStyle figure { padding-bottom:50%; }

div.show img.A_imgsty,div.show img.B_imgsty,div.show img.C_imgsty,
ul.show div img.A_imgsty,ul.show div img.B_imgsty,ul.show div img.C_imgsty
{ background:#FFF; cursor:pointer; }
div.show img.A_imgsty,div.show img.B_imgsty,
ul.show div img.A_imgsty,ul.show div img.B_imgsty
{ -webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);filter:grayscale(100%);transition:all .5s ease; }
div.show:hover img.A_imgsty,div.show:hover img.B_imgsty,
ul.show div:hover img.A_imgsty,ul.show div:hover img.B_imgsty
{ -webkit-filter:grayscale(0);-moz-filter:grayscale(0);-ms-filter:grayscale(0);-o-filter:grayscale(0);filter:grayscale(0);transition:all .5s ease; }

div.show img.B_imgsty,div.show img.C_imgsty,
ul.show div img.B_imgsty,ul.show div img.C_imgsty
{ backface-visibility:hidden; transition:all .5s ease; transform:perspective(800px) rotateY(0deg);}
div.show:hover img.B_imgsty,div.show:hover img.C_imgsty,
ul.show div:hover img.B_imgsty,ul.show div:hover img.C_imgsty
{ transform:perspective(800px) rotateY(360deg); }



/* 叠加水印图特效 */
div.marker {
	width:100%; height:100%; opacity:0; filter:alpha(opacity=0); position:absolute; z-index:88;
	background-color:transparent; background-image:url(../images/mtop.png); background-repeat:no-repeat;
	background-position:center 100%; background-size:auto;
}
div.show:hover div.marker {
	opacity:1; filter:alpha(opacity=100); background-position:center center; background-size:auto;
}



/* Ainkeys style */
div.A-Intop:hover img.imgsty,div.A-Triangle div.show:hover img,div.A-Shades div.show:hover img {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

div.show div.mask i.icon { width:70px; height:70px; margin-left:-35px; margin-top:-35px; text-align:center; font-size:24pt; line-height:70px; color:#DDD; }
div.show div.mask i.icon { position:absolute; left:50%; top:200%; z-index:20; transition:all .5s ease; }

div.show:hover div.mask { opacity:1; filter:alpha(opacity=100); background-color:transparent; }
div.show:hover div.mask i.icon { background:rgba(0,0,0,.1); border-radius:50%; top:50%; transition:all .5s ease; }

div.show div.mask tt { width:95%; height:39px; padding:0 2.5%; text-align:center; position:absolute; left:0; bottom:0; z-index:15; }
div.show div.mask tt {
	text-transform:uppercase;
	transform:rotateY(360deg) scale(0);
	background-color:transparent;
	height:35px; bottom:5%;
	transition:all .5s ease;
}
div.show:hover div.mask tt {
	background-color:transparent;
	transform:rotateY(0) scale(1);
	transition:all .5s ease;
	line-height:2;
}


div.A-Triangle div.mask:before,div.A-Triangle div.mask:after,div.A-Triangle div.show:before,div.A-Triangle div.show:after {
	width:100%; height:50%; background:rgba(0,0,0,.6);
	content:""; position:absolute; top:-50%; left:50%; z-index:1!important;
	transform:translateX(-50%) translateY(0%);
	-webkit-clip-path:polygon(0 0, 50% 100%, 100% 0);
	clip-path:polygon(0 0, 50% 100%, 100% 0);
	transition:all .3s;
}
div.A-Triangle div.mask:after {
	top:auto; bottom:-50%;
	transform:translateX(-50%) translateY(0%);
	-webkit-clip-path:polygon(50% 0%, 0% 100%, 100% 100%);
	clip-path:polygon(50% 0%, 0% 100%, 100% 100%);
}
div.A-Triangle div.show:before {
	width:50%; height:100%; top:50%; left:auto; right:-50%;
	transform:translateX(0%) translateY(-50%);
	-webkit-clip-path:polygon(100% 0, 0 50%, 100% 100%);
	clip-path:polygon(100% 0, 0 50%, 100% 100%);
}
div.A-Triangle div.show:after {
	width:50%; height:100%;
	top:50%; right:auto; left:-50%;
	transform:translateX(0%) translateY(-50%);
	-webkit-clip-path:polygon(0 100%, 100% 50%, 0 0);
	clip-path:polygon(0 100%, 100% 50%, 0 0);
}

div.A-Triangle div.mask:hover:before { top:0; }
div.A-Triangle div.mask:hover:after { bottom:0; }
div.A-Triangle div.show:hover:before { right:0; }
div.A-Triangle div.show:hover:after { left:0; }


div.A-Shades div.show:before,div.A-Shades div.show:after,div.A-Shades div.mask:before,div.A-Shades div.mask:after {
	width:25%; height:100%; background:linear-gradient(transparent,rgba(0,0,0,.6));
	content:''; position:absolute; left:0;top:0; z-index:1!important;
	transform:translateY(-100%);
	transition:all 0.3s;
}
div.A-Shades div.show:hover:before,div.A-Shades div.show:hover:after,div.A-Shades div.mask:hover:before,div.A-Shades div.mask:hover:after { transform:translateY(0); }
div.A-Shades div.show:after{ left:25%; }
div.A-Shades div.mask:before{ left:50%; }
div.A-Shades div.mask:after{ left:75%; }
div.A-Shades div.show:hover:before{ transition-delay:0.225s; }
div.A-Shades div.show:hover:after{ transition-delay:0.075s; }
div.A-Shades div.mask:hover:before{ transition-delay:0.15s; }
div.A-Shades div.mask:hover:after{ transition-delay:0s; }



/* 图文平铺列表样式 */
dl.K-Shadow,dl.K-Shadow dt { position:relative; }
dl.K-Shadow { width:90%; height:auto; padding:15px 5%; }
dl.K-Shadow .Remarks { width:100%; height:90px; margin-bottom:5px; }
dl.K-Shadow dt { width:100%; height:58px; font-size:13pt; line-height:65px; margin-bottom:15px; }
dl.K-Shadow dt a { font-size:inherit; line-height:inherit; }

dl.K-Shadow dt:before,dl.K-Shadow dt:after { content:""; position:absolute; left:0; bottom:3px; }
dl.K-Shadow dt:after { width:28px; border-bottom:1px solid #333; z-index:0; transition:all .5s; }
dl.K-Shadow dt:before { width:100%; border-bottom:1px solid #DDD; z-index:-1; }
dl.K-Shadow:hover dt:after { width:100%; transition:all .5s; }


dl.K-Shadow:before,dl.K-Shadow:after {
  width:150%; height:8px;
  content: ''; position: absolute; left:0; top:-40px; z-index: -1;
  -webkit-box-shadow: 0 15px 16px #666;
  -moz-box-shadow: 0 15px 16px #666;
  box-shadow: 0 15px 16px #666;
  -webkit-transform: skew(-15deg) rotate(-6deg);
  -moz-transform: skew(-15deg) rotate(-6deg);
  -ms-transform: skew(-15deg) rotate(-6deg);
  -o-transform: skew(-15deg) rotate(-6deg);
  transform: skew(-15deg) rotate(-6deg); 
}

dl.K-Shadow:after {
  left:auto; right:0;
  -webkit-transform: skew(15deg) rotate(6deg);
  -moz-transform: skew(15deg) rotate(6deg);
  -ms-transform: skew(15deg) rotate(6deg);
  -o-transform: skew(15deg) rotate(6deg);
  transform: skew(15deg) rotate(6deg); 
}

.IMG_List_2 .K-Shadow:before,.IMG_List_2 .K-Shadow:after { top:-55px; }
#Body_Main .IMG_List_2 .K-Shadow:before,#Body_Main .IMG_List_2 .K-Shadow:after { top:-50px; }


.KE_IMG_Show div.show,.KE_IMG_Show div.show:hover,.KE_IMG_Show div img.imgsty,.KE_IMG_Show div:hover img.imgsty,
.KE_IMG_Show div label.Title,.KE_IMG_Show div:hover label.Title,.KE_IMG_Show div p.Author,.KE_IMG_Show div:hover p.Author,
.KE_IMG_Show div ul.Zfloat,.KE_IMG_Show div:hover ul.Zfloat,div.marker,div.show:hover div.marker
{ transition:all .5s ease; -moz-transition:all .5s ease; -webkit-transition:all .5s ease; -o-transition:all .5s ease; }