/*reset*/
html{background:none;color:#333; min-height:100%;}
body{font-size:16px;font-family:verdana;line-height:1.8em; font-family:Microsoft YaHei,Tahoma,Arial; background-color:#fff; min-height:100%; width:100%; overflow:hidden;}
body, div, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, textarea, p, th, td, dl, dt, dd{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
img{border:none;}
address, caption, cite, code, dfn, em, th, var, b, i{font-style:normal;font-weight:normal;}
li{list-style-image:none;list-style-position: outside;list-style-type:none;}
caption, th{text-align:left;}
h1, h2, h3, h4, h5, h6{font-size:100%;font-weight:normal;vertical-align:baseline;zoom:1;}
input, textarea, select, button{font-size: 12px;font-weight:inherit; vertical-align:middle}
input[type=radio], input[type=checkbox]{vertical-align: middle; margin-right:5px;}
textarea{resize:none;}
input[type=text],input[type=password],textarea, input[type=text]:focus, input[type=password]:focus, textarea:focus, button, button:focus{-webkit-appearance:textfield;outline:0}
/*base*/
a{text-decoration:none; color:#ddd;}
a:focus{outline-style:none;outline-width:0;}
a:link, a:visited, a:active{text-decoration:none;}
a:hover{text-decoration:none;}
label.checkbox, label.radio, label.text{padding-left:4px;vertical-align:top;}
/*margin*/
/*clear*/
.clearfix:after{content: ".";display: block;height:0;clear: both;visibility:hidden}
.clearfix {zoom:1}

.am_css{transition:all 0.8s ease-in-out; -webkit-transition:all 0.8s ease-in-out;}
.am_css2{transition:all 2s ease-in-out; -webkit-transition:all 2s ease-in-out;}

/*Top*/
#zhuanti_top{width:100%;height:50px; position:fixed; top:0px; left:0px; z-index:999; text-align:center;background:url(../image/top.gif) #fff repeat-x; margin:0 auto;}
#zhuanti_center{width:950px;margin:8px auto 0px;font-size:12px;color:#000;height:33px;line-height:12px;clear:both;}
#zhuanti_center a.mLink{color:#828282;text-decoration:none;}
#zhuanti_center a.mLink:hover{color:red;}
#zhuanti_center #miniLogo{float:left;}
#zhuanti_center #miniLogo img{border:0;height:33px;}
#zhuanti_center #miniLink{float:right;padding:12px 8px 0 0;}


@keyframes up{
	0%  {transform:translate(0,0);}
	50%	{transform:translate(0,-10px);}
	100%{transform:translate(0,0);}
}
@-webkit-keyframes up{
	0%  {-webkit-transform:translate(0,0);}
	50%	{-webkit-transform:translate(0,-10px);}
	100%{-webkit-transform:translate(0,0);}
}

.pageItem{position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden;}
.pageItem .wrap{height:100%;}
.imgFull{width:100%;}

/*page-1*/
.page-1 .bg{background:#151517;}
.page-1 .logo{ width:564px; position:absolute; top:50px;  left: 50%; margin-left:-282px;}
.page-1 .slogan{position: absolute; width:100%; height:154px; text-align:center; top: 93%; left:0; margin-top:-160px;}
.page-1 .slogan img{ display: inline; width:auto;}
.page-1 .btn{cursor:pointer; width:26px; height:21px; position:absolute; left:50%; margin-left:-13px; top:93%; margin-top:22px; background:url(../image/btn.png) no-repeat;}

.page-1 .imgFull{position:relative;}


/*page-2 zhaolujie*/
.page-2{background-color:#fff;}
.page-2 .leftcolumn{position:absolute; left:0; top:0;width: 610px; height: 100%;}
.page-2 .leftcolumn ul{position:absolute; left:0; top:0; width:100%; height:100%;}
.page-2 .leftcolumn li{position:absolute; width:100%; height:100%; overflow:hidden; left:0; top:-100%; height: 100%;}
.page-2 .leftcolumn .bg{height:100%; position:absolute; left:0; top:0; width:100%;}
.page-2 .leftcolumn .bg .item{zoom:1; position:relative;height: 100%;}
.page-2 .leftcolumn .bg img{display:block; height:100%; width:100%;}
.page-2 .leftcolumn .bg span{position:absolute; left:0; bottom:10px;background:#1A1A1C;height:48px;line-height:48px;color:#de9c52;padding:0px 22px;font-size:18px;}

@keyframes btn{
	0%  {transform:scale(1);}
	50% {transform:scale(1.3);}
	100%{transform:scale(1);}
}
@-webkit-keyframes btn{
	0%  {-webkit-transform:scale(1);}
	50% {-webkit-transform:scale(1.3);}
	100%{-webkit-transform:scale(1);}
}

.page-2 .maincolumn{position:absolute; top:0; left:0;margin-top:80px; left: 610px; width: 528px; font-size:16px; line-height:31px; padding:0 0 0 50px;}
.page-2 .maincolumn h1{color:#151517; line-height:32px; display:inline; border-bottom:2px solid #DE9C52; font-size:30px;}
.page-2 .maincolumn h1 span{font-size:16px;}
.page-2 .maincolumn p{ margin-top:21px; position: relative;}
.page-2 .maincolumn a{background:#E1A460; color:#FFFFFF; line-height:30px; padding:0px 18px; width:64px; display:block;margin-top:20px;}


.page-2 .rightcolumn{position:absolute; right:0; top:50px; height:91%;}
.page-2 .rightcolumn .current{border:4px solid #DE9C52;}
.page-2 .rightcolumn li{height:25%; cursor:pointer; position:relative; left:100%; overflow:hidden;border-bottom:1px solid #fff;border-top:1px solid #fff;}
.page-2 .rightcolumn li img{width:100%; display:block;}
 
/*灿的电脑是1440 银丰的电脑是1280*/
/*屏宽>1346并且<1430的设备*/
@media screen and (min-width: 1346px) and (max-width: 1430px) {
	.page-2 .maincolumn{padding:0 0 0 20px; width:480px;}
} 
@media screen and (min-width: 1220px) and (max-width: 1345px) {
	.page-2 .leftcolumn{width: 540px;}
	.page-2 .maincolumn{padding:0 0 0 20px; width:430px;left: 540px;}
}
@media screen and (min-width: 1100px) and (max-width: 1220px) {
	.page-2 .leftcolumn{width: 450px;}
	.page-2 .maincolumn{padding:0 0 0 20px; width:400px;left: 450px;}
}
@media screen and (min-width: 1005px) and (max-width: 1100px) {
	.page-2 .leftcolumn{width: 380px;}
	.page-2 .maincolumn{padding:0 0 0 20px; width:360px; left: 380px; }
}
@media (max-width: 1005px) {
	.page-2 .leftcolumn{width: 350px;}
	.page-2 .maincolumn{padding:0 0 0 20px; width:330px; left: 350px; }
}

/*page-3*/
.page-3 {background:#FFFFFF; }
.page-3 .wrap{background:#FFFFFF;height:94%; width:1300px; position:absolute; left:50%;margin-left:-650px; margin-top:50px;}
.page-3 .left_column{float:left; width:64%; line-height:30px; margin-top:50px;position:relative; left:-100%;}
.page-3 .left_column h1{font-size:24px; display:inline; border-bottom:2px solid #DE9C52;}
.page-3 .left_column p{margin-top:26px;}
.page-3 .right_column{float:right;height:100%; position:relative; left:50%;}
.page-3 .right_column img{height:100%; float:right;}

@media screen and (min-width: 1100px) and (max-width: 1300px) {
	.page-3 .wrap{width:1100px; margin-left:-550px;}
	.page-3 .left_column{width:59%;}
} 
@media (max-width: 1100px) {
	.page-3 .wrap{width:960px; margin-left:-480px;}
	.page-3 .left_column{width:55%;}
} 

/*page-4*/
.page-4 {background:#FFFFFF; }
.page-4 .wrap{background:#FFFFFF;height:94%; position:absolute; margin-top:50px; width:100%;}
.page-4 .left_column4{float:left; width:67%; height:100%; line-height:30px; margin-top:10px;position:relative; left:0%; bottom:0%;}
.page-4 .left_column4 div{margin-left:43px; height:30%;}
.page-4 .left_column4 h1{font-size:24px; line-height:40px; display:inline; border-bottom:2px solid #DE9C52;}
.page-4 .left_column4 p{margin:20px 0px 15px; color:#333333; width:790px;}
.page-4 .left_column4 h2{font-size:18px; color:#151517;}
.page-4 .left_column4 h2 span{border-bottom:1px solid #DE9C52;}
.page-4 .left_column4 ul{height:70%; width:100%; position: absolute;bottom:0;left:0;}
.page-4 .left_column4 li{position: absolute; float: left;  }
.page-4 .left_column4 li img{width:100%;height:100%;}
.page-4 .left_column4 li span{display:none; position:absolute; left:3px; bottom:10px;background:#1A1A1C;height:48px;line-height:48px;color:#de9c52;padding:0px 22px;font-size:18px;}
.page-4 .project_d01 {width:50%;height:50%;top:0%;left:0%;}
.page-4 .project_d02 {width:50%;height:50%;top: 0%;left: 50%;}
.page-4 .project_d03 {width:50%;height:50%;top: 50%;left: 0%;}
.page-4 .project_d04 {width:50%;height:50%;top: 50%;left: 50%;}

.page-4 .right_column4{float:right;height:100%; width:33%; position:relative; }
.page-4 .right_column4 img{height:100%; width:100%;}
.page-4 .right_column4 span{display:none; position:absolute; left:0; bottom:10px;background:#1A1A1C;height:48px;line-height:48px;color:#de9c52;padding:0px 22px;font-size:18px;}

@media screen and (min-width: 1242px) and (max-width: 1535px) {
	.page-4 .left_column4 div{margin-left:35px; height:35%;}
	.page-4 .left_column4 ul{height:65%;}	
} 
@media screen and (min-width: 960px) and (max-width: 1242px) {
	.page-4 .left_column4 div{margin-left:35px; height:37%;}
	.page-4 .left_column4 p{margin:15px 0px 10px; width:100%;}
	.page-4 .left_column4 ul{height:63%;}	
} 



/*page-5*/
.page-5 {background:#FFFFFF; }
.page-5 .wrap{background:#FFFFFF;height:94%; position:absolute; margin-top:50px;width:100%;}
.page-5 .left_column5{float:left; height:100%; width:48%;  line-height:30px; position:relative; left:0%; bottom:0%;}
.page-5 .left_column5 h2{font-size:18px; color:#151517; margin-left:43px;margin-bottom:10px;}
.page-5 .left_column5 h2 span{border-bottom:1px solid #DE9C52;}
.page-5 .left_column5 ul{position: absolute;bottom:0;left:0;height:94%; width:100%;}
.page-5 .left_column5 li{height:33.3%; position: absolute; float: left;border-top:3px solid #fff;border-left:3px solid #fff;  }
.page-5 .left_column5 li img{width:100%;height:100%;}
.page-5 .left_column5 li span{display:none; position:absolute; left:0; bottom:10px;background:#1A1A1C;height:48px;line-height:48px;color:#de9c52;padding:0px 22px;font-size:18px;}
.page-5 .project_a01 {width:52.6%;top:0%;left:0%;}
.page-5 .project_a02 {width:47%;top: 0%;left: 53%;}
.page-5 .project_a03 {width:100%;top: 33.3%;left: 0%;}
.page-5 .project_a04 {width:100%;top: 66.7%;left: 0%;}
.page-5 .right_column5{position:relative; right:0; top:0; height:100%; width:52%; float:right;}
.page-5 .right_column5 ul{height:100%;border-left:3px solid #fff;}
.page-5 .right_column5 li{height:33.3%;position:relative; left:0%; overflow:hidden;border-top:3px solid #fff;border-right:3px solid #fff;}
.page-5 .right_column5 li img{width:100%;height:100%;}
.page-5 .right_column5 li span{display:none; position:absolute; left:0; bottom:10px;background:#1A1A1C;height:48px;line-height:48px;color:#de9c52;padding:0px 22px;font-size:18px;}

/*page-6*/
.page-6 {background:#FFFFFF; }
.page-6 .wrap{background:#FFFFFF;height:94%; width:100%; position:absolute; margin-top:50px;}
.page-6 .left_column6{float:left; width:56%; line-height:30px; margin-top:50px; margin-left:5%; position:relative; left:-100%;}
.page-6 .left_column6 h1{font-size:24px; display:inline; border-bottom:2px solid #DE9C52; line-height:40px;}
.page-6 .left_column6 p{margin-top:26px;}
.page-6 .left_column6 h3{margin-top:26px; line-height:48px;}
.page-6 .right_column6{float:right;height:100%; position:relative; left:50%; width:37%; margin-right:3px;}
.page-6 .right_column6 img{height:100%; width:100%;}

@media screen and (min-width: 1250px) and (max-width: 1521px) {
	.page-6 .left_column6{width:49%; margin-left:3%; }
	.page-6 .left_column6 h3{margin-top:24px; line-height:44px;}
	.page-6 .right_column6{width:40%; }
} 
@media screen and (min-width: 1175px) and (max-width: 1250px) {
	.page-6 .left_column6{width:45%; margin-left:3%; }
	.page-6 .left_column6 h3{margin-top:20px; line-height:42px;}
	.page-6 .right_column6{width:47%; }
} 
@media screen and (min-width: 960px) and (max-width: 1175px) {
	.page-6 .left_column6{width:50%; margin-left:3%; }
	.page-6 .left_column6 h3{margin-top:10px; line-height:38px;}
	.page-6 .right_column6{width:45%; }
} 

/*page-7*/
.page-7 {background:#FFFFFF; }
.page-7 .wrap{background:#FFFFFF;height:94%; width:100%; position:absolute; margin-top:50px;}
.page-7 .left_column7{float:left; width:44%; line-height:30px; margin-top:20px; margin-left:4%; position:relative; left:0%;}
.page-7 .right_column7{float:right; width:44%; line-height:30px; height:100%; margin-right:4%; margin-top:20px; position:relative; left:0%;}
.page-7 h1{font-size:24px; color:#151517; display:inline; border-bottom:2px solid #DE9C52; padding-bottom:4px;}
.page-7 h3{margin-top:14px; font-size:18px; line-height:48px;}
.page-7 h3 a{color:#151517;}
.page-7 p{margin-top:2px; padding-bottom:17px; color:#333333; border-bottom:1px dashed #E9BE8E;}
.page-7 .clear_line{border-bottom:0px;}

@media (max-width: 1253px) {
	.page-7 .left_column7{width:48%;margin-top:20px; margin-left:1%;}
	.page-7 .right_column7{width:48%; margin-top:20px; margin-right:1%; }
	.page-7 p{font-size:14px; line-height:28px;}
} 

/*page-8*/
.page-8 {background:#FFFFFF; }
.page-8 .wrap{background:#FFFFFF;height:96%; width:94%; position:absolute; margin:60px 3% 0px 3%;}
.page-8 h1{font-size:24px; color:#151517; display:inline; border-bottom:2px solid #DE9C52; padding-bottom:4px;}
.page-8 h3{margin-top:20px; color:#333333; line-height:28px; }
.page-8 hr{height:1px;border:none;border-top:1px dashed #E9BE8E;margin-top:28px;}
.page-8 p{margin-top:2px; padding-top:19px; color:#333333; }
.page-8 img{text-align:center; left:50%; margin-left:-219px; margin-top:38px; position:relative; bottom:0;}
.page-8 h5{position:relative; text-align:center; font-size:12px; color:#333333; }
.page-8 h5 span{color:#151517; }

@media screen and (min-width: 1150px) and  (max-width: 1521px) {
	.page-8 h3{margin-top:18px; }
	.page-8 p{padding-top:17px;}
} 
@media screen and (min-width: 1062px) and  (max-width: 1150px) {
	.page-8 h3{margin-top:14px; }
	.page-8 p{padding-top:15px;}
} 
@media (max-width: 1061px) {
	.page-8 h3{margin-top:10px; font-size:14px; }
	.page-8 p{padding-top:12px; font-size:14px;}
} 

/*jScrollPan*/
.jspVerticalBar{width:5px; background:none;}
.jspHorizontalBar{background:none; display:none;}
.jspTrack{background-color:#fff;}
.jspDrag{background-color:#ccc;background-color:rgba(0,0,0,0.2);}

.look_gif{width:400px; height:225px; position:absolute; left:50%; top:50%; margin-left:-200px; margin-top:-114px; background-repeat:no-repeat; background-image:url(http://mat1.gtimg.com/fashion/zhuanti/looknew/look.png);}
.look_wall{position:absolute; width:100%; height:100%; left:0; top:100%; overflow:hidden; opacity:0.4; filter:alpha(opacity=40);}
.look_wall .bg{width:100%; height:100%; position:absolute; left:0; top:0; background-color:#cb3230;}

.loading{position:absolute; left:0; top:0; width:100%; height:100%; background-color:#cb3230; z-index:999;}
.loading .in{width:495px; height:222px; background:url(http://mat1.gtimg.com/fashion/zhuanti/looknew/loading.gif) no-repeat; position:absolute; left:50%; top:50%; margin-left:-248px; margin-top:-111px;}
.loading .num{width:100%; color:#fff; text-align:center; line-height:20px; height:20px; position:absolute; left:0; bottom:-10px; font-size:14px; font-family:Arial;}