@charset "utf-8";
/* CSS Document */

  


body,html{  margin:0; padding:0; color:#666;   font-family: 'Source Sans Pro', 'Microsoft Jhenghei', '微軟正黑體', Helmet, Freesans, sans-serif;
	   font-family: "LinotypeUniversW01-Regu";font-family:微軟正黑體, Arial, Helvetica, sans-serif;}


body,html,h1,h2,h3,h4,h5,h6,p,div,b,c,e,g,j,k,dd,dt,dl,span,strong,a{ font-size:1em; font-weight:normal; margin:0; padding:0;    text-decoration: blink;}

body,html{height:100%;}

body .target.index-3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,30px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
body .action.index-3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}
a{ color:#333; text-decoration:none;}
ul, ol, li, dl, dd {margin: 0;padding: 0; list-style:none;}

.clearfix:after{content: '';clear: both;display: block;}

@keyframes myanimate{0% { transform:translateY(0) scale(1,1);}100%{transform:translateY(15px)  scale(0.9,0.9);}}
@-webkit-keyframes myanimate{0% { transform:translateY(0) scale(1,1);}100%{transform:translateY(15px)  scale(0.9,0.9);}}



/*----------------浏览器下拉条DIV---------------------*/
::-webkit-scrollbar-thumb {background: #333;-webkit-border-radius: 8px;}
::-webkit-scrollbar {background: #eee;width: 10px;}


.at-header{ display: block;position: fixed;width: 100%;z-index: 99999;height:70px;top: 0;left: 0;background:#fff;    text-align: center;}
.at-header .logo{     width: 150px;display: inline-block;overflow: hidden;margin:8px 0 0 0; }
.at-header .logo img{ height: 50px;}
.drawer-open .drawer-hamburger .drawer-hamburger-icon:before{ background: #222;}
.drawer-open .drawer-hamburger .drawer-hamburger-icon:after{ background: #222;} 
.drawer-menu-item b{     opacity: 0;position: absolute;top:9px;height: 1px;background: #222;width: 0;left: 0;}
.drawer-menu-item{ position: relative;}
.drawer-menu-item:hover b{width: 100%;opacity: 1;transition: all 0.3s linear 0s;-webkit-transition: all 0.3s linear 0s;}
.pc-header{ display:block;top:0;height: 70px;  position: absolute;    left: 0;width: 90%;padding: 0 5%;}
.pc-header dl{ position: relative;display: block;text-decoration: blink;font-size: 16px;color: #999;line-height: 1.6em;float: left;margin:30px 2% 0 0;height: 40px;    padding-bottom: 10px; }
.pc-header dl a{ color: #999;}
.pc-header dl a b{ opacity: 0; display: block;background: #eee;height: 1px;width: 100%;margin-left: 100%;}
.pc-header dl:hover a{color:#333;}
.pc-header dl:hover a b{ opacity: 1; margin-left:0;transition: all 0.4s linear 0s;-webkit-transition: all 0.4s linear 0s;} 
.pc-header dl dt{ display: none;position: fixed;background:#fff;padding: 2% 5%;left: 0;width: 100%;text-align: left; border-top: 1px solid #eee;    top: 70px;}
.pc-header dl dt a{    text-align: center; display: block;color: #999;font-size: 14px;margin: 0 1%;float: left;width: 10%;}
.pc-header dl dt a span{display: inline-block;border-bottom: 1px solid #ddd;font-size: 15px;}
.pc-header dl dt a img{ display: block;width: 100%;    opacity: 0.8;}
.div2_1 .at-header{height: 50px;    border-bottom: 2px solid#eee;background:#f7f7f7;transition: all 0.1s linear 0s;-webkit-transition: all 0.1s linear 0s; }
.div2_1 .at-header .logo{ margin-top: 8px;}
.div2_1 .at-header .logo img{ height: 30px; }
.div2_1 .pc-header dl{font-size:15px; margin-top: 5px;}
.at-h-top{ display: block;position: absolute;right: 5%;top: 8px;}
.at-h-top a{ line-height:70px;vertical-align: top;font-size: 15px;color: #999;display: inline-block;    margin-left: 10px;}
.at-h-top a img{ display: block;height: 20px;margin-top: 50%;opacity: 0.6;margin-left: 5px;}
.div2_1 .pc-header{    top: 10px;}
.div2_1 .at-h-top a{line-height:50px;}
.div2_1  .pc-header dl dt{top:51px;}
.pc-header dl:hover dt{display: block;}
.pc-header dl:hover dt a{ color:#999;}
.div2_1 .at-h-top{    top: 0;}




.page-video-vi .txt font{display:block;text-align:center;font-size:1.1em;letter-spacing:1px;padding:3em 0;
     
 margin-bottom:3em;border-bottom: 1px solid #ddd;}

.page-news-list h1{color:#000}


.news-show{ }
.news-show h4{ text-align: center;margin: 1% 0 3%; }
.news-show h4 font{ color: #666;font-size: 12px;}
.news-show .news-s-t{ display: block;width: 1300px;margin: 0 auto;overflow: hidden;}
.news-show .news-s-t p{ margin: 0;padding: 0;line-height: 30px;font-size: 16px;}
.news-show .news-s-t span{}
.news-show .new-s-bottom{ display: block;background: #fcfcfc;margin: 5% 0 0 0;padding: 2% 10%;overflow: hidden;}
.news-show .new-s-bottom dd{    font-size: 14px; display: block;float: left;width: 50%;overflow: hidden;}
.news-show .new-s-bottom dd strong{ display: block;float: left;font-size: 14px;color: #666;}
.news-show .new-s-bottom dd a{ display: block;float: left;font-size: 14px;color: #666;}
.news-show .new-s-bottom dt{ display: block;float: right;width: 180px;background: #eee;overflow: hidden;}
.news-show .new-s-bottom dt a{ display: block;text-align: center;color: #666;font-size: 14px;line-height: 2em;}







.banner{display: block;overflow: hidden;height:90%;position: relative;width: 100%; padding-top:70px;}
.banner img{ display: block;width: 100%;height: 100%;overflow: hidden;}
.banner dt{    display: inline-block;color: #333;border-bottom: 1px solid #ddd; }
.banner .brtxt{    text-align: center;position: absolute;width: 100%;height: auto;top: 40%;left: 0;z-index: 9;}
.banner .brtxt span{    display: block;text-align: center;color: #eee;font-size: 20px;font-family: Arial;letter-spacing: 2px;}
.banner .brtxt font{    line-height: 1.6em;display: block;text-align: center;font-size: 44px;color: #eee;font-family: Arial;}
.banner .brtxt a{display: inline-block;color: #eee;font-family: Arial;font-size: 14px;border-bottom: 1px solid #eee;}







.in-brand{ display: block;width: 90%;margin: 5%;overflow: hidden;background:#fff6f6;}
.in-brand img{ display: block;width: 50%;float: left;}
.in-brand dt{ display: block;float: left;padding:10% 5%;width: 40%;}
.in-brand dt span{ display: block;font-size: 26px;margin-bottom: 5%;color: #777;}
.in-brand dt font{    line-height: 30px; display: block;font-size: 16px;width: 80%;margin-bottom: 5%;color: #999;}
.in-brand dt a{ display: inline-block; border: 1px solid #d6d5d5; color: #999;font-size: 14px;padding: 1% 5%;}
 
.in-brand dt a:hover{ background: #eee;border: 1px solid #eee;color: #666; }





.in-two{display: block;background: #f9f3f4;padding: 5% 5%;overflow: hidden;}
.in-two a:nth-child(2n){float: right;}
.in-two a{ display: block;float: left;width: 49%;overflow: hidden;    position: RELATIVE;}
.in-two a img{ display: block;width: 100%; -webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s; }
.in-two a dt{    text-align: CENTER; position: ABSOLUTE;top: 0;left: 0;width: 100%;height: 100%;}
.in-two a dt span{ display: BLOCK;text-align: center;color: #fff;font-size: 22px;    margin:15% auto 2%;}
.in-two a dt font{display: block;width: 4%;background: #eee;height: 1px;margin: 0 auto 5%;}
.in-two a:hover img{-webkit-transform:scale(1.03); -moz-transform:scale(1.03); transform:scale(1.03);}








.in-about{display: block;padding: 5% 0;background:#f6f6f6;overflow: hidden;    position: RELATIVE;}
.in-about dt{ display: block;width: 60%; overflow: hidden;float: left;margin-left: 5%;}
.in-about dt .i-about-left{ display: block;float: left;width: 100%;}
.in-about dd{ margin-right: 5%;display: block;width: 28%;overflow: hidden;float: right;}
.in-about dd .i-about-right{ margin-bottom: 30px;display: block;width: 100%;}
.in-about dd strong{  display: block; color: #666;font-size: 20px; font-family: Arial;margin-bottom: 20px;border-bottom: 1px solid #ddd;    letter-spacing: 2px;}
.in-about dd span{ color: #888;font-size: 13px;display: block; margin: 0 auto 20px;    font-family: Arial;letter-spacing: 1px;}
.in-about dd a{ font-family: Arial;font-size: 12px;display: inline-block;border-bottom: 1px solid #ddd;color: #999;}







.in-product{display: block;padding: 8% 5%;background:#f3fdff;overflow: hidden;position: RELATIVE;}
.in-product .in-pro-img1{ float: left;width: 50%;position: RELATIVE;}
.in-product .in-pro-img2{float: left;width: 50%;position: RELATIVE;}
.in-pro-txt1{ position: relative;padding-bottom: 25%;background: #efecec;float: left;width: 25%;}
.in-pro-txt2{ margin-top: -25%;margin-left: 25%;background-color:#e9eff3;float: left;position: RELATIVE;width: 25%;padding-bottom: 25%;}
.in-pro-img1 img,.in-pro-img2 img{width:100%; display: block;}

.in-pro-txt1 dt,.in-pro-txt2 dt{ text-align: center;width: 100%; position: absolute;top: 30%;left: 0;} 
.in-pro-txt1 dt span,.in-pro-txt2 dt span{    color: #666; display: block;text-align: center;width: 100%; font-size: 22px;}
.in-pro-txt1 dt font,.in-pro-txt2 dt font{    color: #888; display: block;width: 50%;margin: 5% auto;text-align: center;font-size: 12px;}
.in-pro-txt1 dt a,.in-pro-txt2 dt a{ font-family: Arial;font-size: 12px;display: inline-block;border-bottom: 1px solid #ccc;color: #999;}

.in-product .in-pro-img1 dl,.in-product .in-pro-img2 dl{ text-align: center;width: 80%; position: absolute;top: 3%;left: 10%;}
.in-product .in-pro-img1 dl a,.in-product .in-pro-img2 dl a{ width:49%;margin-right:2%;    float: left;    margin-bottom: 2%;}
.in-product .in-pro-img1 dl a:nth-child(2n),.in-product .in-pro-img2 dl a:nth-child(2n){ width:49%;margin-right:0;    float: right;    }
.in-product .in-pro-img1 dl a img,.in-product .in-pro-img2 dl a img{ display: block;width: 100%;   margin-bottom: 3%; opacity: 0.9; /*  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.03);*/transition: all 0.1s linear 0s;-webkit-transition: all 0.1s linear 0s; }
.in-product .in-pro-img1 dl a dt,.in-product .in-pro-img2 dl a dt{}
.in-product .in-pro-img1 dl a dt span,.in-product .in-pro-img2 dl a dt span{ display: block;float: left;height: 1px;width: 10%;background: #ddd;margin-top: 9px;margin-right: 5%;}
.in-product .in-pro-img1 dl a dt font,.in-product .in-pro-img2 dl a dt font{ color: #ccc;font-size: 12px;display: block;float: left;height: 20px;line-height: 20px;}
.in-product .in-pro-img1 dl a:hover img,.in-product .in-pro-img2 dl a:hover img{  opacity: 0.6;  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.06);transition: all 0.1s linear 0s;-webkit-transition: all 0.1s linear 0s; }

.in-product-xian2{    position: absolute;width: 10%;bottom: 20%;height: 2px;background: #b3bfc7;left: 45%;z-index: 3;}
.in-product-xian1{   position: absolute;width: 10%;top: 20%;height: 2px;background: #e0cdcd;left: 45%;z-index: 3;}







.index-video{ display: block;overflow: hidden;padding:0 5%;background:#f9f3f4; position: relative;}
.i-video-left{ display: block;top: 0;width: 35%;padding:0 5%;overflow: hidden; height: 100%;position: absolute;}
.i-video-left img{display: block;height: 41%;position: absolute;top: 22%;background: #9e8488;width: 80%; left: 10%;}
.i-video-left dt{ text-align: center;position: absolute;z-index: 8;top:36%;left: 10%;width:80%;}
.i-video-left dt span{     text-align: center;display: block;color: #eee;font-size: 12px;font-family: Arial;line-height: 1em;margin-bottom: 20px;    letter-spacing: 6px;}
.i-video-left dt span b{     font-weight: bold;display: inline-block;font-size:20px;line-height: 1.1em;border-bottom: 1px solid #eee;margin-bottom: 0.3em;    letter-spacing: 6px;}
.i-video-left dt span c{    display: block;text-align: CENTER;    font-size: 14px;letter-spacing: 4px;}
.i-video-left dt a{display: inline-block;color: #eee;border-bottom: 1px solid #ddd;font-size: 12px;}
.i-video-left dt font{letter-spacing: 2px;text-align: center;color: #eee;font-size: 16px;display: block;}
.i-video-right{ position: relative;display: block;float: right;width: 50%;overflow: hidden;}
.i-video-right a{ position: absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: 9;}
.i-video-right .i-v-r-a{ display: block;width: 100%;overflow: hidden;}
.i-video-right .i-v-r-b{ position: absolute;z-index: 5;left:50%;top: 45%;}




.in-bottom{background:#f5f4f4;padding: 5% 0 2% 0;text-align: center;display: BLOCK;overflow: hidden;}
.in-bottom dt{ display: inline-block;position: relative;width: 23%;vertical-align: top;margin: 0 1%;}
.in-bottom dt a{ position: absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: 3;}
.in-bottom dt img{     opacity:0.98;display: block;width: 100%; }
.in-bottom dt span{ display: block;text-align: center;line-height:1em;font-size: 14px;margin: 1em 0; color: #999;}
.in-bottom dt:hover span{ color:#555;}



 
.in-video{display: block;overflow: hidden;height: 100%;position: relative;width: 100%; }
.in-video .index-3{height:auto}
.in-video .index-3 ul{ margin: 0;padding: 0;width: 100%;display: block;}
.in-video .index-3 .mask-txt i{     background:rgba(204, 187, 159, 0.74);width: 100%;margin: 0;left: 0;position: absolute;height: 100%;}
.in-video .index-3 .mask-txt i .txt{ font-family: Arial;font-size:30px;display: block;text-align: center;    margin-top: 20%;}
.in-video .index-3 .mask-txt i .txt span{    display: block;font-family: 'Source Sans Pro', 'Microsoft Jhenghei', '微軟正黑體', Helmet, Freesans, sans-serif;font-family: "LinotypeUniversW01-Regu";font-family: 微軟正黑體, Arial, Helvetica, sans-serif;
                                           color: #fff;font-size: 27px;margin-bottom: 5px;    letter-spacing: 2px;}
.in-video .index-3 .mask-txt i img{    display: block;text-align: center;margin: 10px auto;}
.in-video .index-3 ul li{ position: relative;}
.in-video .index-3 ul li video{ width: 100% !important;height: auto !important;margin-left: 0 !important;}
.in-video .index-3 .mask-txt{top:0}
.in-video .wrap{ position: relative;height: 100%;}
.in-video .video-auto-box .at-img{    height: 100% !important;}
 


.footer{display: block;padding:10% 5% 3% 5%; overflow: hidden;}
.footer h3{     position: relative;display: block;overflow: hidden;border-bottom: 1px solid #ccc;margin-bottom: 2em;    padding-bottom: 1em;}
.footer h3 dt{ display: block;float: left;overflow: hidden;    margin-top: 2%;}
.footer h3 dt img{height:30px;}
.footer h3 dd{width: 50%; display: block;overflow: hidden;float: left;margin-left: 10%;    margin-top: 2%;}
.footer h3 dd a{ color: #989898;font-size: 14px;margin: 0 6% 0 0; line-height:30px; height:30px;display: block;float: left; }
.footer h3 dd a:hover{color:#222;}
.footer h3 dl{ width: auto; display: block;float: right;overflow: hidden;    margin-bottom: 0;}
.footer h3 dl strong{ display: block;overflow: hidden;text-align: center; float: left;margin-left: 20px;}
.footer h3 dl strong img{ display: block;width: 90px;}
.footer h3 dl strong span{ display: block;text-align: center;font-size: 14px;color: #999;}
.footer h4{ display: block;overflow: hidden;}
.footer h4 span{ display: block;float: left;font-size: 13px;color: #989898;}
.footer h4 font{ display: block;float: right;font-size: 13px;color: #d4d4d4;}
.footer h4 a{ display: block;float: right;font-size: 13px;color: #ddd;}







.in-two .target.in-two1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.in-two .action.in-two1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-two .target.in-two2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.in-two .action.in-two2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}



body .target.in-brand{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
body .action.in-brand{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}



body .target.at-header{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);transition: 50ms ease 50ms; -webkit-transition: 100ms ease 100ms;}
body .action.at-header{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.at-header .target.logo{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.at-header .action.logo{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


body .target.banner{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
body .action.banner{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.banner .target.brtxt{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(30px,0px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.banner .action.brtxt{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

body .target.in-video{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,30px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
body .action.in-video{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.in-about .target.i-about-left{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.in-about .action.i-about-left{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-about .target.i-about-right{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.in-about .action.i-about-right{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-about .target.i-about-bd{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.in-about .action.i-about-bd{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-about .target.i-about-bd1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.in-about .action.i-about-bd1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-about .target.i-about-bd2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 700ms ease 700ms; -webkit-transition: 800ms ease 800ms;}
.in-about .action.i-about-bd2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.index-video .target.i-video-left{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.index-video .action.i-video-left{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.index-video .target.i-video-right{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.index-video .action.i-video-right{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-bottom .target.in-bottom-d1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.in-bottom .action.in-bottom-d1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-bottom .target.in-bottom-d2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.in-bottom .action.in-bottom-d2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-bottom .target.in-bottom-d3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.in-bottom .action.in-bottom-d3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

body .target.footer{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
body .action.footer{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.in-product .target.in-pro-a{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 300ms ease 300ms; -webkit-transition: 500ms ease 500ms;}
.in-product .action.in-pro-a{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.in-product .target.in-pro-img1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.in-product .action.in-pro-img1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-product .target.in-pro-txt1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.in-product .action.in-pro-txt1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-product .target.in-pro-img2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.in-product .action.in-pro-img2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-product .target.in-pro-txt2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.in-product .action.in-pro-txt2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-product .target.in-product-xian1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.in-product .action.in-product-xian1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.in-product .target.in-product-xian2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.in-product .action.in-product-xian2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-news-list .target.page-news-lista{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-news-list .action.page-news-lista{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.page-product-list .target.page-product-lista:nth-child(1n){ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.page-product-list .action.page-product-lista:nth-child(1n){ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-product-list .target.page-product-lista:nth-child(2n){ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.page-product-list .action.page-product-lista:nth-child(2n){ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

 















body .target.page-news-banner{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,30px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
body .action.page-news-banner{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}






.page-news-banner{ display: block;overflow: hidden;position: relative;padding: 100px 0 1%;background:#f3efe9;}
.page-news-banner img{    display: block;width: 100%;}
.page-news-banner dt{     text-align: center;display: block;overflow: hidden;}
.page-news-banner dt span{       color: #666;display: block;text-align: center;font-size: 26px;}
.page-news-banner dt strong{    display: block;height: 1px;background: #666;width: 2%;margin: 1% auto;}

.page-news-list{ display: block;overflow: hidden;padding: 5% 5% 0;}
.page-news-list a{ text-decoration: blink;display: block;float: left;width:30%;margin-right: 5%; margin-bottom: 10%;    overflow: hidden;}
.page-news-list a dt span{    letter-spacing: 2px; display: block;color: #666;font-size: 14px;font-weight: bold;    height: 70px;overflow: hidden;}
.page-news-list a dt font{    letter-spacing: 1px; color: #ccc;font-size: 12px;font-family: Arial;}
.page-news-list a dt strong{    letter-spacing: 2px; color: #999;font-size: 12px;display: block;margin:1% 0 3%;}
.page-news-list a img{   -webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s;display: block;width: 100%;margin-bottom: 5%;}
.page-news-list a h3{    display: block;float: left;width: 20%;margin-right: 5%;height: 1px;background: #999;margin-top: 5%;}
.page-news-list a dt{display: block;float: left;width: 75%;}
.page-news-list a:hover img{ -webkit-transform:scale(1.05); -moz-transform:scale(1.05); transform:scale(1.05);}
.page-news-list a:hover span{ color:#333;}

.page-news-list a:nth-child(3n){ float: right;margin-right: 0;}
.page-news-list a:nth-child(4n),.page-news-list a:nth-child(5n),.page-news-list a:nth-child(6n),.page-news-list a:nth-child(7n){width:21.25%;}
.page-news-list a:nth-child(6n){ float: left;margin-right: 5%;}
.page-news-list a:nth-child(7n){ float: right;margin-right: 0; }
.page-news-list a:nth-child(8n),.page-news-list a:nth-child(9n),.page-news-list a:nth-child(10n){width:30%;margin-right:5%;float: left;}
.page-news-list a:nth-child(9n){ float: left;margin-right: 5%;}
.page-news-list a:nth-child(10n){ float: right;margin-right: 0; }
.page-news-list a:nth-child(11n),.page-news-list a:nth-child(12n),.page-news-list a:nth-child(13n),.page-news-list a:nth-child(14n){width:21.25%;}
.page-news-list a:nth-child(14n){float: right;margin-right: 0; }
.page-news-list a:nth-child(15n),.page-news-list a:nth-child(16n),.page-news-list a:nth-child(17n){width:30%;margin-right:5%;float: left;}
.page-news-list a:nth-child(17n){float: right;margin-right: 0; }
.page-news-list a:nth-child(18n),.page-news-list a:nth-child(19n),.page-news-list a:nth-child(20n),.page-news-list a:nth-child(21n){width:21.25%;    float: left;}



.page-product-banner{display: block;padding: 130px 0 1%;    background: #efefef;}
.page-product-banner h3{    overflow: hidden;display: block;text-align: center;font-size: 26px;margin: 0 auto;width: 90%;}
.page-product-banner h3 span{    display: block;height: 1px;background: #ccc;width: 2%;margin: 5px auto 3%;}
.page-product-banner h4{    display: block;text-align: center;overflow: hidden;    width: 90%;margin: auto;}
.page-product-banner h4 a{    font-size: 15px;display: inline-block;color: #888;margin: 0 3% 0 0;  }
.page-product-banner h4 a:nth-child(4n){border:0;     margin-right: 0;padding-right: 0;}

.page-product-list{ display: block;overflow: hidden;padding: 5%;    background: #f6f6f6;}
.page-product-list a:nth-child(3n){float: right;margin-right:0%;}
.page-product-list a{margin-right:5%;position: relative;text-decoration: blink;display: block;float: left;width:30%;  margin-bottom: 5%;}
.page-product-list a dt span{ letter-spacing: 1px; display: block;color: #666;font-size: 16px;    width: 80%;margin-bottom: 5%; }
.page-product-list a dt font{    display: inline-block;letter-spacing: 1px; color: #ccc;font-size: 12px;font-family: Arial;}
.page-product-list a dt strong{     letter-spacing: 2px;color: #999;font-size: 12px;display: block;width: 100%;float: left;    margin: 5% 0;}
.page-product-list a img{background: #fff; display: block;width: 60%;    padding:20% 5%;  -webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s;}
.page-product-list a dt{    position: absolute;top: 40%;left: 65%;display: block;width: 50%;}
.page-product-list a dt h3{ display: block;height: 1px;background: #ccc;    float: left;width: 20%;}
.page-product-list a:hover img{-webkit-transform:scale(1.05); -moz-transform:scale(1.05); transform:scale(1.05);}


.p-brand1{display: block;overflow: hidden;padding:10% 5% 2%;background: #f6f6f6;}
.p-brand1 h3{ display: block;height: 1px;width: 10%;background: #ccc;float: left;margin: 1% 1% 0 0;}
.p-brand1 h4{ display: block;float: left;overflow: hidden;}
.p-brand1 h4 span{ display: block;font-size: 22px;color: #333;letter-spacing: 2px;}
.p-brand1 h4 font{ display: block;font-size: 15px;letter-spacing: 1px;margin: 1.6em 0;}
.p-brand1 h4 strong{display: block;overflow: hidden;}
.p-brand1 h4 strong span{    display: block;float: left;border-left: 1px solid #ddd;padding:0 3em 2em 1em;font-size: 16px;color: #666;}

.p-brand2{ position: RELATIVE;display: block;overflow: hidden;padding: 5% 0;}
.p-brand2 img{ display: block;width: 50%;margin-left: 45%;}
.p-brand2 dt{ display: block;position: ABSOLUTE;width: 50%;left: 15%;height:50%;z-index: 3;background: rgba(174, 134, 118, 0.92);top: 25%;}
.p-brand2 dt span{ display: block;float: left;height: 1px;width: 10%;margin: 11% 2% 0 15%;background: #fff;}
.p-brand2 dt strong{display: block;float: left;margin: 10% 0 0 0;width: 55%;}
.p-brand2 dt strong span{float: none;margin: 0;background: none;height: auto;color: #fff;font-size: 22px;width: auto;margin-bottom:5%;letter-spacing: 2px;}
.p-brand2 dt strong font{ color: #fff;font-size: 14px;line-height: 24px;letter-spacing: 1px;}
.p-brand2 dt strong strong{    float: left;color: #eee;width: 100%;font-size: 13px;margin: 2em 0;letter-spacing: 1px;}
.p-brand2 dd{  position: absolute;top: 5%;left: 5%;font-family: Arial;font-size: 30px;letter-spacing: 5px;color: #ddd;}

.p-brand3{ display: block;overflow: hidden;position: relative;    background: #f2f5f4;padding: 5% 0;}
.p-brand3 dl{ display: block;width: 90%;margin: 0 auto 2em;overflow: hidden;}
.p-brand3 dl h3{ display: block;height: 1px;width: 10%;background: #ccc;float: left;margin: 1% 1% 0 0;}
.p-brand3 dl h4{display: block;float: left;overflow: hidden;}
.p-brand3 dl h4 span{    color: #333;letter-spacing: 2px;display: block;font-size: 22px; }
.p-brand3 dl h4 font{       letter-spacing: 2px; display: block;font-size: 16px;    margin: 1.6em 0;}
.p-brand3 dl h4 strong span{    display: block;float: left;border-left: 1px solid #ddd;padding:0 3em 2em 1em;font-size: 16px;color: #666;}
.p-brand3 dl h4 strong{display: block;overflow: hidden;}
.p-brand3 img{ display: block;width: 50%;    margin-left: 5%;}
.p-brand3 dt{ display: block;position: ABSOLUTE; width: 50%;left: 40%;height: 40%;z-index: 3;background: rgba(174, 134, 118, 0.92);bottom:20%;}
.p-brand3 dt span{    display: block;float: left;height: 1px;width: 10%;margin: 11% 2% 0 15%;background: #fff;}
.p-brand3 dt strong{    display: block;width: 55%;margin: 10% 0 0 0;overflow: hidden;}
.p-brand3 dt strong span{letter-spacing: 1px;display: block;color: #fff;font-size: 22px;float: none;height: auto;background: none;width: auto;margin: 0 0 5% 0;}
.p-brand3 dt strong font{     color: #fff;font-size: 15px;line-height: 28px;letter-spacing: 1px;}
.p-brand3 dt strong strong{    float: left;color: #eee;width: 100%;font-size: 13px;margin: 1em 0;}

.p-brand-bottom{ display: block;    width: 1000px;margin: 5% auto;overflow: hidden;}
.p-brand-bottom dt:nth-child(2n){float: right;width:48%;}
.p-brand-bottom dt{float: left;height: 300px;position: relative;width: 50%;overflow: hidden;display: block;}
.p-brand-bottom dt #p-b-b-video1{    display: block;width: 100%;}
.p-brand-bottom dt #p-b-b-video2{    position: absolute;z-index: 3;top: 40%;left: 45%;}
.p-brand-bottom dt a{}
.p-brand-bottom dt h3{ position: relative;background: #f6f6f6;display: block;overflow: hidden;    text-align: center;margin-bottom: 10px;height: 200px;}
.p-brand-bottom dt h3 strong{text-align: center; display: block;margin-top: 60px;overflow: hidden;margin-bottom: 20px;}
.p-brand-bottom dt h3 strong span{    font-size: 14px;display: block;overflow: hidden;width: 80%;margin: 0 auto;}
.p-brand-bottom dt h3 a{ display: inline-block;color: #666;border: 1px solid #ccc;font-size: 14px;    padding: 3% 8%;}
.p-brand-bottom dt h4{display: block;text-align: center;overflow: hidden;background: #eee;    height: 100px; }
.p-brand-bottom dt h4 a{ color: #666;border-bottom: 1px solid #ccc;display: inline-block;    margin-top: 30px;}




.page-product-banner .target.p-p-banner1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-product-banner .action.p-p-banner1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-product-banner .target.p-p-banner2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-product-banner .action.p-p-banner2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-product-banner .target.p-p-banner3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-product-banner .action.p-p-banner3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.p-brand-bottom .target.p-brand-bottom1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.p-brand-bottom .action.p-brand-bottom1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand-bottom .target.p-brand-bottom2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.p-brand-bottom .action.p-brand-bottom2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand-bottom .target.p-brand-bottom3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.p-brand-bottom .action.p-brand-bottom3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand-bottom .target.p-brand-bottom4{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.p-brand-bottom .action.p-brand-bottom4{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.at-header .target.pc-header{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.at-header .action.pc-header{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

  
.p-brand1 .target.p-brand1-1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.p-brand1 .action.p-brand1-1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand1 .target.p-brand1-2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.p-brand1 .action.p-brand1-2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand1 .target.p-brand1-3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.p-brand1 .action.p-brand1-3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand1 .target.p-brand1-4{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.p-brand1 .action.p-brand1-4{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.p-brand2 .target.p-brand2dt{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.p-brand2 .action.p-brand2dt{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.p-brand2 .target.p-brand1-5{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.p-brand2 .action.p-brand1-5{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand2 .target.p-brand1-6{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.p-brand2 .action.p-brand1-6{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand2 .target.p-brand1-7{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.p-brand2 .action.p-brand1-7{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand2 .target.p-brand1-8{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.p-brand2 .action.p-brand1-8{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand2 .target.p-brand1-9{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.p-brand2 .action.p-brand1-9{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}



.p-brand3 .target.p-brand3dd{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.p-brand3 .action.p-brand3dd{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.p-brand3 .target.p-brand1-10{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 300ms ease 300ms; -webkit-transition: 400ms ease 400ms;}
.p-brand3 .action.p-brand1-10{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand3 .target.p-brand1-11{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.p-brand3 .action.p-brand1-11{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand3 .target.p-brand1-12{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.p-brand3 .action.p-brand1-12{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand3 .target.p-brand1-13{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.p-brand3 .action.p-brand1-13{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.p-brand3 .target.p-brand1-14{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(50px,0px);transition: 700ms ease 700ms; -webkit-transition: 800ms ease 800ms;}
.p-brand3 .action.p-brand1-14{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}











.page-video-vi{ display: block;overflow: hidden;padding: 5%;background: #f6f6f6;}
.page-video-vi img{ display: block;width: 60%;margin: 0 auto 5%;}
 


.page-video1{ display: block;overflow: hidden;padding: 0;}
.page-video1 h3{ display: block;overflow: hidden;padding: 100px 0 3%;text-align: CENTER;background: #ece3d4;    font-size: 26px;color: #777;}
.page-video1 h4 {     overflow: hidden;display: BLOCK;padding: 5% 20%;}
.page-video1 h4 span{    margin-top: 1%;display: block;height: 1px;width: 20%;background: #ccc;float: left;margin-right: 2%;}
.page-video1 h4 font{    color: #999;display: BLOCK;float: left;width: 78%;overflow: hidden;}
.page-video1 h4 font b{    color: #777;font-size: 26px;display: BLOCK;margin-bottom: 10px;}


.page-video2{     position: relative;display: BLOCK;overflow: hidden;padding: 5% 0 2%;    background: #f3f0ec;}
.page-video2 div{ position: relative;width: 90%;margin: 0 auto;display: block;overflow: hidden;}
.page-video2 dt{    text-align: left; position: absolute;top: 0;display: block;overflow: hidden;width: 40%;height: 80%;background: #f3f0ec;left: 0;    padding:8% 5%;}
.page-video2 dt .img1,.page-video2 dt .img2,.page-video2 dt .img3,.page-video2 dt .img4{display: inline-block;width: 22%;overflow: HIDDEN;margin: 0 1%;vertical-align: top;}
.page-video2 dd{  float: right;display: block;overflow: hidden;width:50%;}
.page-video2 dd .img5{display: block;width: 100%;}
 
.page-video3{    padding: 0 0 5% 0;}
.page-video3 dd{  float: left;display: block;overflow: hidden;width:45%;}
.page-video3 dt{    left: auto;text-align: right; position: absolute;top: 0;display: block;overflow: hidden;width: 40%;height: 80%;background: #f3f0ec;right: 0;    padding: 8% 5%;}



body .target.page-video1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 50ms ease 50ms; -webkit-transition: 100ms ease 100ms;}
body .action.page-video1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video1 .target.page-video1-1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-video1 .action.page-video1-1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video1 .target.page-video1-2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.page-video1 .action.page-video1-2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video1 .target.page-video1-3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.page-video1 .action.page-video1-3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


body .target.page-video2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
body .action.page-video2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video1-4 .target.img1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-video1-4 .action.img1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video1-4 .target.img2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.page-video1-4 .action.img2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video1-4 .target.img3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.page-video1-4 .action.img3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video1-4 .target.img4{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.page-video1-4 .action.img4{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}



 
.page-video3 .target.img1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-video3 .action.img1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video3 .target.img2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.page-video3 .action.img2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video3 .target.img3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.page-video3 .action.img3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video3 .target.img4{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.page-video3 .action.img4{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video2 .target.img5{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.page-video2 .action.img5{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}





.page-video-vi .target.img1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-video-vi .action.img1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.page-video-vi .action.img2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.page-video-vi .action.img3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img4{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.page-video-vi .action.img4{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img5{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-video-vi .action.img5{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img6{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.page-video-vi .action.img6{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img7{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.page-video-vi .action.img7{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img8{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.page-video-vi .action.img8{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img9{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 200ms ease 200ms; -webkit-transition: 300ms ease 300ms;}
.page-video-vi .action.img9{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img10{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 400ms ease 400ms; -webkit-transition: 500ms ease 500ms;}
.page-video-vi .action.img10{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img11{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 500ms ease 500ms; -webkit-transition: 600ms ease 600ms;}
.page-video-vi .action.img11{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}

.page-video-vi .target.img12{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.page-video-vi .action.img12{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}





.pro-index{}

 
.pro-index .p-i-1{ position: relative; display: block;width: 80%;margin: 5% auto;overflow: hidden;}
.pro-index .p-i-1 img{ display: block;float: left;width: 30%; margin-left: 1%;}
.pro-index .p-i-1 strong{position: absolute;height: 1px;width: 16%;background: #ccc;margin: 2% 0 0 0;}
.pro-index .p-i-1 .p-i-1-img1{ width:56%;}
.pro-index .p-i-1 dl{ position: absolute;top: 0;right: 0;width: 40%; padding-top: 5%;}
.pro-index .p-i-1 dl dt{display: block;overflow: hidden;margin-bottom: 5%;margin-left: 18%;}
.pro-index .p-i-1 dl dt span{ display: block;font-size: 22px;color: #888;margin-bottom: 10px;}
.pro-index .p-i-1 dl dt font{ display: block;font-size: 16px;color: #999;} 


.pro-index .p-i-2{ position: relative; display: block;width: 80%;margin: 5% auto;overflow: hidden;}
.pro-index .p-i-2 img{ display: block;float: left;width: 56%; margin-left: 1%;}
.pro-index .p-i-2 strong{position: absolute;height: 1px;width: 16%;background: #ccc;margin: 2% 0 0 0;}
.pro-index .p-i-2 dl{ position: absolute;top: 0;right: 0;width: 40%; padding-top: 5%;}
.pro-index .p-i-2 dl dt{display: block;overflow: hidden;margin-bottom: 5%;margin-left: 18%;}
.pro-index .p-i-2 dl dt span{ display: block;font-size: 22px;color: #888;margin-bottom: 10px;}
.pro-index .p-i-2 dl dt font{ display: block;font-size: 16px;color: #999;} 



.pro-index .p-i-3{ position: relative; display: block;width: 80%;margin: 5% auto;overflow: hidden;}
.pro-index .p-i-3 img{ display: block;float: left;width:56%; margin-left: 1%;}
.pro-index .p-i-3 strong{position: absolute;height: 1px;width: 16%;background: #ccc;margin: 2% 0 0 0;}
.pro-index .p-i-3 dl{ position: absolute;top: 0;right: 0;width: 40%; padding-top: 5%;}
.pro-index .p-i-3 dl dt{display: block;overflow: hidden;margin-bottom: 5%;margin-left: 18%;}
.pro-index .p-i-3 dl dt span{ display: block;font-size: 22px;color: #888;margin-bottom: 10px;}
.pro-index .p-i-3 dl dt font{ display: block;font-size: 16px;color: #999;} 



.pro-index .p-i-4{ position: relative; display: block;width: 80%;margin: 5% auto;overflow: hidden;}
.pro-index .p-i-4 img{ display: block;float: left;width: 56%; margin-left: 1%;}
.pro-index .p-i-4 strong{position: absolute;height: 1px;width: 16%;background: #ccc;margin: 2% 0 0 0;}
.pro-index .p-i-4 dl{ position: absolute;top: 0;right: 0;width: 40%; padding-top: 5%;}
.pro-index .p-i-4 dl dt{display: block;overflow: hidden;margin-bottom: 5%;margin-left: 18%;}
.pro-index .p-i-4 dl dt span{ display: block;font-size: 22px;color: #888;margin-bottom: 10px;}
.pro-index .p-i-4 dl dt font{ display: block;font-size: 16px;color: #999;} 


 

.pro-index .target.p-i-1{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.pro-index .action.p-i-1{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.pro-index .target.p-i-2{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.pro-index .action.p-i-2{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.pro-index .target.p-i-3{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.pro-index .action.p-i-3{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}


.pro-index .target.p-i-4{ opacity: 0;transform: translate(0px,0px);-webkit-transform: translate(0px,50px);transition: 600ms ease 600ms; -webkit-transition: 700ms ease 700ms;}
.pro-index .action.p-i-4{ opacity: 1;transform: translate(0px,0px);-webkit-transform: translate(0px,0px);}




.page-contact{ overflow:hidden;}
.page-contact-left{width: 50%;float: left;overflow: hidden; height:750px;}
.page-contact-left h3{margin: 10% 10% 0;overflow: hidden;}
.page-contact-left h3 p{color: #fff;font-size: 36px;margin-bottom:4%;}
.page-contact-left h3 font{display: block;color: #fff;font-size: 13px;margin-bottom: 1%; line-height:20px;}
.page-contact-left form{margin: 3% 10% 10%;overflow: hidden;}
.page-contact-left form input{background: none;border: 1px solid #999;font-size: 15px;line-height: 2.4em;text-indent: 1em; float:left;
width:80%;}
.page-contact-left form .textarea_a{font-size: 15px;text-indent: 0.6em;width:79.2%;background: none;border: 1px solid #999;
height: 8em;line-height: 3em;}
.page-contact-left form font{ overflow:hidden; margin-top:4%;    display: block;}
.page-contact-left form font span{color: #fff;font-size: 15px;float: left;line-height: 2.6em;}
.page-contact-left form font input{margin-right: 4%;}
.page-contact-left form font img{}
.page-contact-left form b{overflow: hidden;margin-top: 4%;display: block;}
.page-contact-left form b input{width: 30%; padding:0;}
.page-contact-wap{width: 50%;float: left;overflow: hidden;}
.page-contact-left form p {margin-left: 1em;margin-top: 5px;display: block !important;float: left;margin-bottom: 0;}
.page-contact-left form .vali{ width:100%; overflow:hidden;margin-bottom:3.5%;}
.yzm{ overflow:hidden; margin-top:3.5%;}
.yzm span{float: left;font-size: 15px;margin-top: 1.8%;}
.yzm input{width: 22% !important;margin-right: 3%;}
.yzm img{}
.submit{ overflow:hidden; margin-top:3.5%;}
.submit input{}


.new_list{display: block;overflow: hidden;padding: 5% 5% 0;width: 90%;}
.new_list>a{display: block;float: left;width: 30%;margin-right:5%;margin-bottom:5%;}
.new_list>a>img{display: block;width: 100%;margin-bottom: 5%;transition: all .5s;}
.new_list>a:hover img{transform:scale(1.05);}
.new_list>a:hover dt span{color: #333;}
.new_list>a>h3{width: 20%;float: left;margin-right: 5%;height: 1px;background: #999;margin-top: 5%;}
.new_list>a>dt{display: block;float: left;width: 75%;}
.new_list>a>dt>span{letter-spacing: 2px;display: block;color: #666;font-size: 14px;font-weight: bold;min-height: 70px;overflow: hidden;transition: all .5s;}
.new_list>a>dt>p{letter-spacing: 2px;color: #999;font-size: 12px;display: block;margin: 1% 0 3%;}
.new_list>a>dt>i{font-style: normal;letter-spacing: 1px;color: #ccc;font-size: 12px;font-family: Arial;}
.new_list>a:nth-child(3n){margin-right: 0;}


.p_ban{width: 100%;}
.p_ban>img{width: 100%;}
.pro_m{width: 1300px;margin: 82px auto 0;text-align: center;}
.pro_m h3{font-size: 24px;color: #535353;text-align: center;margin-bottom: 20px;}
.pro_m i{display: block;width: 36px;height: 1px;background-color: #aaaaaa;margin: 0 auto 37px;}
.pro_m ul{margin-bottom: 66px;}
.pro_m ul li{display: inline-block;}
.pro_m ul li>a{display: inline-block;width:158px;height: 36px;border: 1px solid transparent;text-align: center;line-height: 38px;font-size: 16px;color: #888888;margin:0 13px;}
.pro_m ul .cp_avt a{border: 1px solid #cdcdcd;}


.pro_list{width: 100%;}
.pro_list .pro_t h3{float: left;width: 48%;}
.pro_list .pro_t h3>img{height: 687px;width: 100%;}

.pro_list .pro_t h4{width: 48%;float: right;}
.pro_list .pro_t h4>a{width: 293px;float: left;margin-bottom:37px;}
.pro_list .pro_t h4>a:nth-child(2n){float: right;}
.pro_list .pro_t h4>a>font{display: block;width: 293px;height: 296px;background-color: #f6f6f6;margin-bottom: 16px;position: relative;}
.pro_list .pro_t h4>a>font>img{max-width: 100%;position:absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);}
.pro_list .pro_t h4>a>p{text-align: center;font-size: 14px;color: #999999;}

.p_four{margin:0 auto;}
.p_four>a{width: 22%;float: left;margin-right:4%;}
.p_four>a:nth-child(4n){margin-right: 0;}
.p_four>a>font{display: block;width: 293px;height: 296px;background-color: #f6f6f6;margin-bottom: 16px;position: relative;}
.p_four>a>font>img{max-width: 100%;position:absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);}
.pro_list .pro_t>a>p{text-align: center;font-size: 14px;color: #999999;}
.pro_list .pro_t:nth-child(3){margin-top:30px;}
.pro_list .pro_t:nth-child(3) h3{float: right;}
.pro_list .pro_t:nth-child(3) h4{float: left;}


.v3{background-color: #FFF !important;}


@media only screen and (min-width: 1800px) and (max-width: 2500px)
{

.page-contact-left{ height:850px;}
#dituContent{ height:850px !important;}

}