@charset "utf-8";
/* CSS Document */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,img,span,table,tr{padding:0;margin:0;}
body{ font-family: "Nunito", -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; color:#232424; padding:0; margin:0; list-style:none; overflow-x: hidden; }
body > section{ padding:0px;}
ul li{ list-style:none; }
p{ padding:0; margin:0;}
.bmax{ width:100%; height:80px; float:left;}
.bob{ width:100%; height:35px; float:left;}
.bmin{ width:100%; height:25px; float:left;}
.bline{ width:100%; height:1px; background:#c6c6c6; float:left; margin:15px 0px;}	
.containermian{ width:100%; height:auto; overflow:hidden; display: flex;}
.md{ width:80%; }
.nmd{ width:95%; }
.amd{ width:90%; }
.bmd{ width:1450px; }
.plr0{ padding: 0px;}
.plr10{ padding: 0px 10px;}
.plr25{ padding: 0px 15px;}
.plra10{ padding: 10px;}
.plra15{ padding: 15px;}
.plra2515{ padding:25px 15px;}
.plra5{ padding: 5px; }
.plra8{ padding: 8px; }
.plra30{ padding: 30px; }
.plra1540{ padding: 18px 40px;}
.mlr0{ margin: 0;}
.pore{ position:relative; z-index:1;}
.poab{ position:absolute;}
.foal{ float:left; }
.foar{ float:right; }
.ht100{ height:100%;}
.bg{ background: #181818;}
.hbg{ background-color: #2f2f2f;}
.cbg{ background:#FFF;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#efefef,direction=120,strength=4);/*兼容ie*/
-moz-box-shadow: 0px 10px 35px #efefef;/*兼容firefox*/
-webkit-box-shadow: 0px 10px 35px #efefef;/*兼容safari或chrome*/
box-shadow:0px 10px 35px #efefef;/*兼容opera或ie9*/
}
.ctc{
background: linear-gradient(bottom, #f2f1f1, #fafafa);
background: -ms-linear-gradient(bottom, #f2f1f1, #fafafa);
background: -webkit-linear-gradient(bottom, #f2f1f1, #fafafa);
background: -moz-linear-gradient(bottom, #f2f1f1, #fafafa);
}
.gtco-loader{ width:100%; height:100%; display: flex; position:fixed; left: 0; top:0; z-index:99; background-image:url(../img/svg-loaders/three-dots.svg); background-position: center center; background-repeat: no-repeat; background-size:80px; background-color: black; opacity: 0.8;}
/*--　浮动 --*/
/*#fixnav{position:fixed;
-webkit-animation:searchTop .5s ease-in-out;
-moz-animation:searchTop .5s ease-in-out;
animation:searchTop .5s ease-in-out
}
-webkit-keyframes searchTop {0% {top:-100px}to {top:0}}
@-moz-keyframes searchTop {0% {top:-100px}to {top:0}}
@keyframes searchTop {0% {top:-100px}to {top:0}}*/

/*-- --*/
.bannerbox{ width:100%; height:100vh; float: left; position: relative; background-color: #000; }
.bannerbox .swiper{ width:100%; height: 100%;}
.bannerbox .swiper-slide{ width:100%; height: 100%; background-size:cover; background-repeat: no-repeat; background-position: center center; display: flex;}
.inbg{ width:100%; height: 100%; position: absolute; left: 0; top:0; background-size: cover; background-position: center; background-repeat: no-repeat; overflow: hidden; }
.banwz{ width:100%; height:100%; position:absolute; right:0; bottom:0;  display: flex; flex-direction: column; justify-content: center; align-items:center;}
.banwz .imy{  display:flex; flex-direction: column; justify-content: center; align-items:flex-start; padding:0px 2%;}
.banwz .right .imy-info{  flex-direction:row-reverse;}
.imy-info{ width:100%; display: flex; flex-direction: row;}
.imy-l{ width: 50%; display: flex; flex-direction: column; }
.imy-l h1{ font-size: 37px; color: #FFF; position: relative; padding: 20px 0px; font-weight: bold;}
.imy-l h1::before{content: ''; position: absolute; left: 0; bottom: 0; width: 50px; height: 5px; background-color: #FFF;}
.imy-l p{ font-size: 17px; color: #e1e1e1; padding: 40px 0px;}
.imy-btns{ width: 170px; height: 50px; background-color: #b39b77; display: flex; justify-content: center; align-items: center; font-size: 16px; color: #FFF; border-radius: 30px;}
.imy-btns:hover{ background-color: #000;}
.imy-r{ width: 50%; display: flex; padding-left: 30px; }
.imy-r i img{ max-width: 100%;}
.banwz .right .imy-info .imy-r{ padding: 0px 30px 0px 0px;}
.bannerbox .swiper-pagination-bullet{ width: 10px; height: 10px; background-color: transparent; opacity: 1; border: 2px solid #FFF;}
.bannerbox .swiper-horizontal>.swiper-pagination-bullets{ bottom:35px;}
.bannerbox .swiper-pagination-bullet-active{ width:25px; background: #FFF; border-radius: 20px; }

/*-- headerbox --*/
.leftbox{ width: 13%; height: 100vh; display: flex; justify-content:flex-start; align-items:flex-start; flex-direction: column; background-color:#eae8e9; flex-shrink: 0; position:fixed; left: 0; top:0; z-index: 100; }
.rightbox{ width:100%; display: flex; padding-left:13%; justify-content: flex-start; align-items: flex-start; flex-direction: column;}
.headerbox{ width:100%; display: flex; padding:60px 0px 0px; flex-direction: column; }
.logo{ width:100%; height:auto; display: flex; padding:0px 25px; }
.logo>i a img{ width: 100%; }
.navbox{ width:100%; height:auto; text-align:center; position: relative; display: flex; padding: 45px 0px;}
.navbox ul{ width:100%; display: flex; align-items:center; justify-content:center; height:auto; flex-direction: column; }
.navbox ul li{ width: 100%; height:45px; display: flex; border-bottom: 1px dashed #7a7668; }
.navbox ul li a{ width:100%; height:100%; display: flex; justify-content: center; align-items: center; flex-direction: column; color:#524e45; font-size:16px; font-weight: 600; position: relative; transition:0.6s; -webkit-transition:0.6s; -moz-transition:0.6s;}
.navbox ul li i{ width:10%; height:2px; background:#1160ab; position:absolute; bottom:-9px; left:45%; visibility:hidden; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s;
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari 和 Chrome */
border-radius: 10px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
}
.navbox ul li:hover{ background-color: darkgrey; transition:0.6s; -webkit-transition:0.6s; -moz-transition:0.6s;}
.navbox ul li:hover a{ color: #FFF; }
#active { background-color: #524e45; margin-top: -1px;}
#active a{ color: #FFF; }
.elsebox{ width: 100%; height: auto; padding:30px 20px 0px; display:flex; justify-content:center; align-items:center; flex-direction:row; position: relative;}
.searchshow{ width:100%; height:37px; background-color: #524e45; display: flex; justify-content: center; align-items: center;}
.searchshow form{ width:100%; padding: 0px 5px; display:flex; justify-content:space-between; align-items: center; flex-direction: row;}
#search_input1{ outline:none; height:100%; width:75%; border:0px solid #CCC; line-height:40px; float:left; color:#ffffff; font-size:13px; margin-top:0; padding:0px 10px; background-color:transparent;}
#search_input2{ float:left; width:25px; height:25px; outline:none;}
#search_input1::-webkit-input-placeholder{ opacity:1; color:#ffffff;}
#search_input1:-moz-placeholder{opacity:1; color:#ffffff;}
#search_input1::-moz-placeholder{opacity:1; color:#ffffff;}
#search_input1:-ms-input-placeholder{opacity:1; color:#ffffff;}

.phone-top{ width:100%; display: flex; justify-content: center; align-items: center; height:auto; background-color:#eae8e9; flex-direction: column; }
.phone-top i{ display: flex; height:50px; display: flex; justify-content: center; align-items: center;}
.phone-top i img{ height:42px;}

/*-- syone --*/
.syone{ width:100%; display: flex; padding: 60px 0px 50px;}
.myone{ width:100%; display: flex;}
.myone i{ display: flex; justify-content: center; align-items: center; flex-direction: column; }
.myone i img{ max-width: 100%;}
.myone .swiper-slide{ display: flex; justify-content: center; align-items: center; height: auto;}
.onebar{ width:100%; height: auto; float: left; margin-top: 20px;}
.onebar .swiper-scrollbar { position: relative; height:1px; background-color: #ccc; border-radius: 1px; }
.onebar .swiper-scrollbar-drag { position: absolute; bottom:0; left: 0; width: 0;height: 300%;background-color: #333; border-radius: 2px}

/*-- sytwo --*/
.sytwo{ width:100%; display: flex; padding: 0px 0px 70px; }
.sytwo .amd{ display: flex; flex-direction: row;}
.sytwo-l{ width:56%; padding:0px 70px 0px 110px; position: relative;}
.sytwo-l i{ width:100%; display: flex;}
.sytwo-l i img{ width:100%; }
.sytwo-l div{ width: 330px; height: 240px; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column; background-color:#b39b76; position: absolute; left:0; bottom:0; padding:35px 10px 0px 30px;}
.sytwo-l div h1{ font-size: 25px; color: #FFF; font-weight: 600; padding: 10px 0px;}
.sytwo-l div p{ font-size: 16px; color: #FFF; padding: 10px 0px;}
.sytwo-r{ width:44%; display: flex; justify-content: space-between; flex-direction: column; padding-top: 35px;}
.sytwo-ra{ width:100%; display: flex; flex-direction: column;}
.sytwo-ra h2{ font-size: 18px; color: #b39b76; padding: 10px 0px;}
.sytwo-ra h1{ font-size: 36px; color: #000; padding: 10px 0px;}
.sytwo-ra p{ font-size: 16px; color: #6c6c6c; padding:30px 0px 0px;}
.sytwo-rb{ width:100%; height: auto; display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.syaone{ display: flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; padding:20px 0px; position: relative; }
.syaone h1{ position: relative; color: #000; font-size:21px;}
.syaone h1 span{ text-align: center; font-size:45px; cursor: pointer; color: #000;}
.syaone h1 sub{ font-weight: 600; font-size:45px; color: #000; bottom:3px; right:-5px; } 
.syaone p{ font-size: 14px; color: #222222; }

.sytwo-btn{ width:100%; display: flex; margin-top: 20px; }
.sytwo-btn a{ width:auto; padding: 0px 30px; height: 55px; border: 2px solid #b39b76; display: flex; justify-content: center; align-items: center; font-size: 17px; color: #524f46; font-weight: 600;}
.sytwo-btn a.button--isi::before { background:#b39b76; }
.sytwo-btn a:hover { color: #FFF; }

/*-- syth --*/
.syth{ width:100%; min-height: 780px; background-color: #000; background-repeat: no-repeat; background-attachment: fixed; background-size:contain; background-position: center; display: flex; justify-content:center; align-items: center; flex-direction: column;}
.syth .amd{ display: flex; justify-content: space-between; align-items: center;}
.sythl{ width:50%; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction: column;}
.sythl-t{ width:100%; display: flex; flex-direction: column;}
.sythl-t p{ display: flex; justify-content:flex-start; align-items: center; flex-direction: row; font-size: 21px; color: #FFF; font-weight: 600;}
.sythl-t i{ width:58px; height: 3px; background-color: #b39b76; margin-left:35px; }
.sythl-t h1{ font-size: 30px; color: #b39b76; font-weight: 600; padding-top: 25px; }
.sythl-w{ width:100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column; padding-top: 80px;}
.sythl-w p{ width: 80%; font-size: 16px; color: #FFF; line-height:30px; }
.sythl-w a{ width: 165px; height:48px; margin-top:60px; display: flex; justify-content: center; align-items: center; flex-direction: column; font-size:17px; color:#FFF; border: 2px solid #FFF; border-radius: 30px; }
.sythr{ width:50%; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction:row; flex-wrap: wrap; border:1px solid rgba(255, 255, 255, 0.5);}
.sythr-one{ width: 50%; height: 240px; padding: 5%; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction: column; border: 1px solid rgba(255, 255, 255, 0.5); position: relative; cursor: pointer; }
.sythr-one i{ margin-top:50px; padding-bottom: 15px; position: relative; z-index: 1;}
.sythr-one i img{ max-width: 100%;}
.sythr-one p{ max-width: 100%; font-size:18px; color: #FFF; font-weight: 600; position: relative; z-index: 1;}
.sythr-one:hover::before { content: ''; position: absolute; left: 0; top:0; width:100%; height: 100%; background-color: black; opacity: 0.3; }
.sythr-one:hover p{ color: #b39b76;}
.sythl-w a.button--isi { color: #FFF; }
.sythl-w a.button--isi::before { background:#FFF; }
.sythl-w a:hover { color: #000; }


/*-- syfo --*/
.syfour{ width:100%; display: flex; flex-direction: column; padding: 60px 0px; background-position: center; background-repeat: no-repeat; background-size: cover; background-color:#000;}
.syfo-t{ max-width: 60%; height:175px; background-color: #b39b76; display: flex; justify-content: flex-start; align-items: center; flex-direction: row;}
.syfo-w{ display: flex; flex-direction: column; padding-left:25%;}
.syfo-w p{ font-size: 18px; color: #e5e5e5; padding: 5px 0px;}
.syfo-w h1{ font-size: 38px; color: #FFF;}
.syfo-t ul{ padding-left:9%; display: flex; flex-direction: row;}
.syfo-t ul li{ width:17px; margin-right: 3px;}
.syfo-t ul li svg{ width:100%;}
.syfo-show{ width:100%; height: auto; display: flex; padding:0px 50px;  flex-direction: column; }
.myfo{ width:100%; padding: 60px 0px;}
.syfo-one{ width:100%; display:flex; position: relative;}
.syfo-one i{ width:100%; display:flex;}
.syfo-one i img{ max-width: 100%; }
.syfo-one h1{ width:100%; position: absolute; left: 0; top:0; padding: 30px; line-height: 20px; font-size: 19px; font-weight: 600; color: #FFF; }
.syfo-btn{ width:100%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.syfo-btn a{ width:240px; height: 55px; display: flex; justify-content: center; align-items: center; flex-direction:column; background-color: #b39b76; font-size: 15px; color: #FFF; font-weight: 600;}

/*-- syfv --*/
.syfv{ width:100%; display: flex;  padding:20px;}
.syfv ul{ width:100%; display: flex; justify-content: center; align-items: center; flex-direction: row;}
.syfv ul li{ width:100%; padding: 15px; display: flex; justify-content: center; align-items: center; flex-direction:row;}
.syfv ul li a{ display: flex; width: 100%; position: relative; overflow: hidden;}
.syfv ul li a img{ width:100%; transition:all 0.6s;-webkit-transition:all 0.6s;-moz-transition:all 0.6s;}
.syfv ul li a h1{ position: absolute; left: 0; top:0; width: 250px; height: 60px; display: flex; justify-content: center; align-items: center; flex-direction: column; font-size: 19px; color: #FFF; background-color: #b39b76;}
.syfv i a img{ width:100%; transition:all 0.6s;-webkit-transition:all 0.6s;-moz-transition:all 0.6s;}
.syfv ul li a:hover img{
transform: scale(1.05);
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
}

/*-- 内页 --*/
.inbanner{ width:100%; height: auto; float:left; position: relative; background-color: #000000;}
.inbanner>i{ width:100%; height:auto; float: left; background-color: #000000; background-position: center; background-repeat: no-repeat;}
.inbanner>i img{ width: 100%; }

/*-- locbox --*/
.locbox{ width:100%; display: flex; justify-content: flex-start; flex-direction: column;}
.locbox ul{ width:100%; display: flex; justify-content:flex-start; align-items: center; flex-direction:row; padding:15px;}
.locbox ul li{ padding-right: 5px; font-size:16px; color: #000; display: flex; justify-content: center; align-items: center;}
.locbox ul li a{ font-size:16px; color: #000;}
.locbox ul li a:hover{ text-decoration: underline; color:#b39b77;}

/*-- 关于我们 --*/
.aboutbox{ width:100%; height: auto; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction: column;}
.ab-a{ width:100%; height: auto; display: flex; padding-bottom: 70px;}
.ab-a .amd{ display: flex; display: flex; justify-content:flex-start; align-items: flex-end; flex-direction: column;}
.ab-a-one{ width:75%; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column; padding:95px 0px; position: relative;}
.ab-a-one h1{ width:550px; display: flex; justify-content:flex-start; align-items: center; flex-direction: column; font-size:38px; color: #000; font-weight:bold;}
.ab-a-one p{ width:70%; font-size:16px; color: #000; line-height: 25px; padding: 30px 0px;}
.ab-a-one i{ width:100%; display: flex; }
.ab-a-one i img{ width:100%;}
.ab-a-one::before{ content: ''; position: absolute; left: 0; bottom: 0; width:100%; height:95px; background-color: #eeeeee;}
.ab-a-two{ width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: row}
.ab-a-two i{width:62%; display: flex; }
.ab-a-two i img{ width:100%;}
.ab-a-two p{ width:38%; display: flex; padding:15px 40px 60px; font-size:16px; color: #000; line-height: 25px; background-color: #eeeeee;}

.ab-b{ width:100%; height:600px; overflow: hidden; background-color: #000; background-repeat: no-repeat; background-attachment: fixed; background-size:contain; background-position: center; display: flex; justify-content:center; align-items: center; flex-direction: column;}
.ab-bt{ width:100%; height: auto; display: flex; padding-top: 20px; justify-content: center; align-items: center; flex-direction: column;}
.ab-bt h1{ font-size: 28px; color: #b39b77; font-weight: 600;}
.ab-bt p{ font-size: 16px; color: #FFF; padding:20px 0px; }
.myzs{ width:90%; display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative; padding: 30px 0px;}
.ab-b .swiper-slide i{ width:100%; float:left;  display: flex; justify-content: center; align-items: center; flex-direction: column; background-color:#b39b77;}
.ab-b .swiper-slide i img{ width:100%; }
.ab-b .swiper-button-prev{ top:60%; left:0px; width:35px; height:35px; background:url(../img/svg-loaders/lleft.svg) center center no-repeat; background-size: 50%; background-color: #b39b77;
-moz-border-radius: 360px; /* Firefox */
-webkit-border-radius: 360px; /* Safari 和 Chrome */
border-radius: 360px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
}
.ab-b .swiper-button-prev:hover{ background:url(../img/svg-loaders/llefth.svg) center center no-repeat; background-color:#000; background-size: 50%;}
.ab-b .swiper-button-next{ top:60%; right:0; width:35px; height:35px; background: url(../img/svg-loaders/rright.svg) center center no-repeat; background-size: 50%; background-color: #b39b77;
-moz-border-radius: 360px; /* Firefox */
-webkit-border-radius: 360px; /* Safari 和 Chrome */
border-radius: 360px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
}
.ab-b .swiper-button-next:hover{ background:url(../img/svg-loaders/rrighth.svg) center center no-repeat;  background-color:#000; background-size: 50%;}
.ab-b .swiper-button-next:after,.ab-b .swiper-button-prev:after{ display: none;}

.ab-c{ width:100%; height: auto; padding: 30px 0px 60px; display: flex; justify-content:center; align-items: center; flex-direction: column;}
.ab-ct{ width:100%; display: flex; justify-content: center; align-items: center; flex-direction:column;}
.ab-ct h1{ font-size: 28px; font-weight:bold; color: #010101; padding:20px 0px;}
.ab-cshow{ width:100%; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction: column;}
.ab-cshow ul{ width:100%; display: flex; justify-content: space-between; align-items:flex-start; flex-direction:row;}
.ab-cshow ul li{ padding:8px; display: flex; align-items: stretch;}
.ab-cshow ul li img{ width:100%;}

/*-- 产品 --*/
.products{ width:100%; display: flex; padding:35px 0px 60px; flex-direction: row; }
.products .amd{ display: flex; flex-direction: row; }
.allbox{width:20%; margin-top:20px; display: flex; flex-direction: column; }
.proL{ width:100%; display: flex; background-color: #524e45; flex-direction: column; border: 1px solid #524e45; overflow: hidden;}
.prol-t{ width:100%; height:60px; background-color: #eae8e9; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 5px;}
.prol-t h1{ text-align: center; font-size: 21px; color: #000; font-weight: 600; font-weight: bold; display: flex; justify-content: center; align-items: center;}
.pronav{ width:100%; display: flex; padding-bottom: 30px; }
.list{width:100%; height:auto; float:left;}
.list ul li{list-style:none; height:auto; width:100%; float:left; padding:15px 0px 15px 25%; border-bottom:1px dashed #eae8e9;}
.list ul li a{ width:100%; padding-right: 25px;  height:auto; float:left; line-height:25px; color:#ffffff; font-size:16px; font-weight: 600;  transition: 0.5s;-webkit-transition: 0.5s; -moz-transition: 0.5s; position:relative;}
.list ul li a i{ width:25px; height:25px; position:absolute; right:0; top:0px; }
.list ul li .inactive i{}
#nchoose{color:#FFF;}
.list ul li ul{ width:100%; height:auto; float:left; padding:5px 0px; display:none;}
.list ul li ul li{ padding:5px 0px; border-bottom:0px solid #bfbfbf; position: relative;}
.list ul li ul li:hover::before{ content: ''; position: absolute; left:-25px; top:5px; width:20px; height:20px; z-index: 2; background-image:url(../img/svg-loaders/sanright.svg); background-position: center; background-repeat: no-repeat; background-size: contain;}
.list ul li ul li a{ font-size:15px; color: #bbbbbb; line-height:20px; padding:0; font-weight: normal; transition: 0.5s;-webkit-transition: 0.5s; -moz-transition: 0.5s; position: relative;}
.list ul li ul li a span{ position: relative; z-index:1; }
.list ul li:hover #di li a{ transition: 0.5s;-webkit-transition: 0.5s; -moz-transition: 0.5s;}
.list ul li:hover #di li:hover a{ color: #b39b77; transition: 0.5s;-webkit-transition: 0.5s; -moz-transition: 0.5s;}
#tchoose::before{ content: ''; position: absolute; left:-25px; top:5px; width:20px; height:20px; z-index: 2; background-image:url(../img/svg-loaders/sanright.svg); background-position: center; background-repeat: no-repeat; background-size: contain;}

.proR{ width:100%; height:auto; display: flex; padding:0px 15px; flex-direction: column;}
.pror-box{ width:100%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.cpmian{ width:100%; height:auto; float:left; position:relative; overflow:hidden;}
.cpmian:before{ content:""; position:absolute; border:1px solid #dfdfdf; width:100%; height:100%; z-index:2;-webkit-transition: 1s;-moz-transition: 1s;transition: 1s;left:0; top:0;}
.cpimgs{ width:100%; height:auto; float:left; overflow:hidden; -webkit-transition: 1s;-moz-transition: 1s;transition: 1s;}
.cpimgs img{ width:100%;}
.cpmian:hover .cpimgs{ transform: scale(1.05);-webkit-transform: scale(1.05);-moz-transform: scale(1.05); overflow:hidden;}
.cpnames{width:100%; height:68px; float:left; text-align: center; display: flex; justify-content: center; align-items: center; flex-direction: column; position:relative; z-index:1; background:#f4f4f4; color:#000; font-size:16px; overflow:hidden; }
.cpmian:hover{filter:progid:DXImageTransform.Microsoft.Shadow(color=#d5d5d5,direction=120,strength=4);/*兼容ie*/
-moz-box-shadow: 0px 0px 10px 0px #d5d5d5;/*兼容firefox*/
-webkit-box-shadow: 0px 0px 10px 0px #d5d5d5;/*兼容safari或chrome*/
box-shadow:0px 0px 10px 0px #d5d5d5;/*兼容opera或ie9*/
-webkit-transition:0.5s;-moz-transition:0.5s;transition:0.5s;
}
.cpmian:hover .cpnames{ background:#b39b77; color:#FFF; -webkit-transition:0.5s;-moz-transition:0.5s;transition:0.5s;}
.proR .page{ padding:0;}

.cpsearch{ width:100%; height: auto; display: flex; margin-top: 10px;}
.cpsearch form{ width:100%;}
.insearch{ width:100%; height:auto; border:2px solid #242424; background: #FFF; overflow:hidden; display: flex; justify-content:space-between; align-items: center; flex-direction: row;}
.insearch .p1{ width:75%; height:45px; float:left;}
.insearch .p2{ width:15%; height:45px; float:right; text-align:center; overflow:hidden; cursor:pointer; }
#search_inputps1{ outline:none; height:100%; width:100%; border:0px solid #CCC; float:left; padding:0px 15px; font-size:14px; color:#242424;}
#search_inputps2{ display:inline-block; width:100%; height:100%; outline:none; cursor:pointer; background-image:url(../img/page/scp.png); background-size:28px; background-color:#FFF; background-position:center; background-repeat:no-repeat; border:0; }
#search_inputps1::-webkit-input-placeholder{ opacity:1; color:#ababab;}
#search_inputps1:-moz-placeholder{opacity:1; color:#ababab;}
#search_inputps1::-moz-placeholder{opacity:1; color:#ababab;}
#search_inputps1:-ms-input-placeholder{opacity:1; color:#ababab;}

/*-- 详细页 --*/
.proinfobox{ width:80%; height:auto; display: flex; padding:20px 0px 0px 30px; flex-direction: column;}
.ban {width:100%; height:auto; float:left; position:relative; z-index:1; display: flex;  flex-direction: row;}
.banl{ width:50%; float: left; display: flex; flex-direction: column; }
.banl .swiper-slide img{ width:100%;}
.mySwipera{ width:100%; position: relative; overflow: hidden; background-color:#f9f9f9; padding: 15px; border: 1px solid #d2d2d2;}
.mySwipera .zoom-hand{ position: absolute; right:15px; bottom:15px; z-index: 1;}
.mySwiperb{ width:100%; position: relative; overflow: hidden; margin-top:10px;}
.mySwiperb .swiper-slide{ border:2px solid #e4e4e4; display: flex; justify-content: center; align-items: center; }
.mySwiperb .swiper-wrapper .swiper-slide{ width:80px; cursor: pointer;}
.mySwiperb .swiper-slide-thumb-active { border:2px solid #b39b77!important;}
#prev1 {  position: absolute;left: 0;top: 50%; transform: translateY(-50%); background: url(../img/svg-loaders/left.svg) center center no-repeat; background-size: 70%;width: 50px; height: 50px; z-index: 99; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s;}
#prev1:hover { background-color: #d2d2d2; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s;}
#next1 { position: absolute;right: 0;top: 50%; transform: translateY(-50%); background: url(../img/svg-loaders/right.svg) center center no-repeat; background-size: 70%;width: 50px; height: 50px; z-index: 99; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s;}
#next1:hover { background-color: #d2d2d2; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s;}
.banr{ width:50%; float: left; display: flex; flex-direction: column; padding-left: 20px; }
.br-a{ width:100%; height:auto; display:flex; justify-content:space-between; align-items: center; border-bottom: 2px solid #f7f7f7;}
.br-a h1{ width:100%; height:auto; float:left; font-size:25px; line-height:25px; color:#010101; padding:15px 0px;  font-weight: 600;}
.updown{ display: flex; }
.updown i{ width:25px; height:25px; float:left; margin:3px; transition:all 0.3s;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;}
.updown a{ width:40px; height:40px; float:left; }
#coll{ fill:#828282; }
.updown a:hover #coll{ fill:#b39b77;}
#non #coll{ fill:#ecebeb; }
.br-b{ width:100%; min-height:200px; display: flex; flex-direction: column;  padding:15px 0px; border-bottom: 2px solid #f7f7f7;}
.br-b p{ font-size: 18px; color: #000; line-height:28px; width:100%; height:auto; float:left;}
.br-c{ width:100%; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction: column; padding: 15px 0px; }
.br-c p{ font-size:18px; color:#414141; }
.br-c ul{ width:70%; margin-top: 15px; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column;}
.br-c ul li{ width: 100%; padding: 5px; margin-top: 10px; display: flex; justify-content: flex-start; align-items: center; flex-direction: row; border: 1px solid #e3e4e9; font-size: 18px; 
background: linear-gradient(bottom, #e4e5ea, #FFF);
background: -ms-linear-gradient(bottom, #e4e5ea, #FFF);
background: -webkit-linear-gradient(bottom, #e4e5ea, #FFF);
background: -moz-linear-gradient(bottom, #e4e5ea, #FFF);
}
.br-c ul li i{ margin-right: 5px;}

/*-- 产品表格 --*/
.cptable{ width:100%; height:auto; float:left; background-color:#f9f9f9; margin-top: 30px; }
.cpform-tv{ width:100%; height:auto; float:left; padding:50px 0px 10px; display: flex; justify-content: center; align-items: center;}
.cpform-tv h1{ float:left; font-size:30px; line-height:35px; color:#333;}
.cpform{ width:100%; padding:20px; float:left; background:#f9f9f9;}
.cpformbx{ width:100%; height:auto; float:left;}
.cpform-t{ width:100%; height:auto; line-height:40px; float:left; color:#7d7d7d; font-size:15px;}
.cpform-t i{ color:#F00; float:left; width:11px; font-style:normal;}
.cpform-t span{ float:left;}
.cpform-x{ width:100%; height:40px; float:left;}
#finput1{ width:100%; height:100%; border:1px solid #dfdfdf; background-color:#FFF; line-height:38px; float:left; color:#7d7d7d; font-size:15px; outline:none; padding:0px 10px;}
.cpform-tx{ width:100%; height:90px; float:left;}
.cpform-tx textarea{float:left; resize:none; width:100%; height:100%; padding:5px 10px; font-size:15px; color:#7d7d7d; outline:none; border:1px solid #dfdfdf; background-color:#FFF;}
.cheakones{width:100%; height:auto; float:left; padding:10px 0px 5px; color:#7d7d7d; font-size:15px;}
.cpformbtn{ width:100%; height:auto; float:left; padding:20px 0px;}
#cpbutton2{ width:160px; height:45px; line-height:45px; background:#595959; float:left; cursor:pointer; font-size:15px; color:#FFF; border:0;
transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s; }
#cpbutton2:hover{background:#b39b77; color:#FFF;
-webkit-transform: translateY(-5px);
-moz-transition: translateY(-5px);
transform: translateY(-5px);
}
/*-- samebox --*/
.samebox{ width:100%; height: auto; float: left; padding: 60px 0px 0px;}
.samet{ width:100%; height: auto; float: left; display: flex; flex-direction: row; justify-content:space-between; align-items: center;}
.samet h1{ font-size:21px; color: #FFF; padding:25px 30px; line-height: 30px; background-color: #b39b77;}
.samet h2{ font-size: 21px; line-height: 28px;}
.samet h2 a{ color: #b39b77; padding: 5px 0px;}
.samet h2 a:hover{ color: #000; }
.same-show{ width:100%; height:auto; float: left; padding:30px 50px 0px; position: relative;}
.same-show .swiper{ }
.moreone{ width:100%; height: auto; float: left;}
.same-show .swiper-button-prev{ left:0px; width:35px; height:35px;  background:url(../img/svg-loaders/lefth.svg) center center no-repeat #6b6b6b; background-size:50%; 
-moz-border-radius: 360px; /* Firefox */
-webkit-border-radius: 360px; /* Safari 和 Chrome */
border-radius: 360px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
}
.same-show .swiper-button-prev:hover{ background:url(../img/svg-loaders/lefth.svg) center center no-repeat #b39b77; background-size:50%; }
.same-show .swiper-button-next{  right:0px; width:35px; height:35px; background: url(../img/svg-loaders/righth.svg) center center no-repeat #6b6b6b; background-size:50%; 
-moz-border-radius: 360px; /* Firefox */
-webkit-border-radius: 360px; /* Safari 和 Chrome */
border-radius: 360px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
}
.same-show .swiper-button-next:hover{ background: url(../img/svg-loaders/righth.svg) center center no-repeat #b39b77; background-size:50%; }
.same-show .swiper-button-next:after,.same-show .swiper-button-prev:after{ display: none;}


/*-- 下载 --*/
.supportbox{ width:100%; height: auto; padding-bottom: 100px; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction: column;}
.sup-t{ width:100%; display:flex; justify-content: center; align-items: center; flex-direction: column;}
.sup-t h1{ font-size: 32px; color: #000000; font-weight: 600; padding: 10px 0px 20px;}
.sup-t ul{ display: flex; justify-content: center; align-items: center; flex-direction: row; padding: 10px 0px;}
.sup-t ul li{ display: flex; padding: 0px 15px;}
.sup-t ul li a{ font-size: 18px; color:#524e45; background-color:#eae8e9; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 5px 20px; border-radius: 5px;}
.sup-t ul li a:hover{ color: #FFF;}
#sup{ background-color: #000; color: #FFF;}
.sup-box{ width:100%; display: flex; flex-direction: column;}
.sup-one{ border: 1px solid #959595; display: flex;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#f3f3f3,direction=120,strength=4);/*兼容ie*/
-moz-box-shadow:-10px 0px 5px 2px #f3f3f3;/*兼容firefox*/
-webkit-box-shadow:-10px 0px 5px 2px #f3f3f3;/*兼容safari或chrome*/
box-shadow:-10px 0px 5px 2px #f3f3f3;/*兼容opera或ie9*/
}
.sup-one a{ width:100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction:column;}
.sup-one a>i{ width:100%; display: flex; padding: 15px;}
.sup-one a>i img{ width:100%; }
.sup-one h1{ width:100%; height:55px; display: flex; justify-content: center; align-items: center; flex-direction:row; background-color:#505050; transition:all 0.6s; -webkit-transition:all 0.6s; -moz-transition:all 0.6s;}
.sup-one h1 span{ display: flex; justify-content: center; align-items: center; flex-direction: row; background-color: #FFF; border-radius: 30px; font-size: 10px; color: #000; padding:5px 15px; line-height: 15px;}
.sup-one h1 span i{ width: 15px; height: 15px; display: flex; justify-content: center; align-items: center; margin-left: 5px;}
.sup-one h1 span i svg{ width: 100%;}
.sup-one:hover h1{ background-color:#b39b77; }

/*-- 新闻 --*/
.newsbox{ width:100%; height: auto; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction: column;}
.news-t{ width:100%; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.news-t h1{ font-size: 32px; color: #000; font-weight: 600; padding: 10px 0px 40px;}
.newsone{ width:100%; height: auto; display: flex; justify-content: center; align-items:center; flex-direction: column;}
.newsone>i{ width:100%; display: flex; background-color: darkgrey; overflow: hidden; order: 1; }
.newsone>i img{ width:100%; transition:all .5s;-webkit-transition:all .5s;-moz-transition:all .5s;}
.newsinfo{ width:100%; height: auto; position: relative; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction:row; order: 2;}
.ndate{ width:100px; height:100px; display:flex; justify-content: center; align-items:flex-start; flex-shrink: 0; flex-direction: column; color: #000; padding: 5px 10px; position:relative; font-weight: 600;}
.ndate h1{ font-size: 24px;}
.ndate h2{ font-size: 14px;}
.nword{ width: 100%; display: flex; min-height:100px; justify-content:center; align-items:flex-start; flex-direction: column; padding:15px 30px; position: relative;}
.nword::before{ content: ''; position:absolute; left:0; top:20px; width:2px; height:60px; background-color: #b39b77; }
.nword::after{ content: ''; position:absolute; left:-2px; top:27px; width:20px; height:2px; background-color: #b39b77; 
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
}
.nword h1{ font-size: 17px; color: #000; line-height:25px; font-weight: 600;}
.nword p{ font-size: 16px; color: #6e6e6e; line-height:25px;}
.newsone:hover i img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.newsone.two{ margin-top: 30px;}
.newsone.two i{ order: 2;}
.newsone.two .newsinfo{ order: 1;}
.newsone.two .nword::before{ content: ''; position:absolute; left:0; top: auto; bottom:20px; width:2px; height:60px; background-color: #b39b77; }
.newsone.two .nword::after{ content: ''; position:absolute; left:-2px; top: auto; bottom:27px; width:20px; height:2px; background-color: #b39b77; 
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
}
.newsone:hover{ background-color: #eeeeee; }

/*-- page --*/
.page{ width:100%;height:auto; float:left;text-align:center;font-size:15px; padding:25px 0px 50px;}
.pagination{text-align:center;width: 100%;}
.pagination ul{width: 100%;height: auto;text-align: center; display: flex; flex-direction:row; align-items: center; justify-content: center;}
.pagination ul li{ display: flex; margin:3px; border: 1px solid #d8d8d8; overflow: hidden;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.pagination ul li:before{}
.pagination ul li i{ font-style: normal; }
.pagination ul li a{ display:inline-block; padding: 0px 3px; width:36px; height:42px; line-height:42px; font-size:18px; color:#000; transition:all 0.6s; -webkit-transition:all 0.6s; -moz-transition:all 0.6s; }
.pagination ul li a:hover{ background:#b39b77; color:#FFF;}
.pagination ul li a.active{ background:#b39b77; color:#FFF;}
#prev:hover,#prev.active,#next:hover,#next.active{ background:#FFF; }
.pagination ul li a img{ width: 80%;}
#cco{ fill:#343434; }
#prevstart #cco{ fill:#aaaaaa; }
#nextend #cco{ fill:#aaaaaa; }

/*-- 新闻详细内容 --*/
.in-newsbox_title { width:100%; padding:50px 0px 15px; font-size:22px; text-align:center; float:left; color:#000;  text-transform: uppercase; }
.in-newsbox_info {width:100%;height:auto;float:left; text-align:center; padding:20px 0px;}
.in-newsbox_info ul li{ width:50%; float:left; font-size:18px; color:#000;}
.in-newsbox_info span{ font-size:18px; color:#000; padding-right:10px;list-style:none; text-align:center; display:inline-block;}
.in-newsbox_content{float:left; font-size:18px; line-height:33px; width:100%; color:#000;}
.in-newsbox_content img{ max-width:100%}
.in-newsbox_content video,.in-newsbox_content iframe{ width:800px; height: 500px;}
.backbtn{ width:100%; height: auto; float: left; text-align: center; display: flex; justify-content: center; align-items: center;}
.backbtn a{ padding: 5px 30px; font-size: 16px; background-color: #323232; color: #ffffff;
 -moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;}
.backbtn a:hover{ background-color: #b39b77;}
.pagee{width:100%;float:left; height:auto; }
.pagees{width:100%;float:left; height:auto; padding: 30px 0px;}
.pagesl{ width:30%; float:left;}
.pagesl p{ width:auto; font-size:16px; line-height:20px; padding:5px 0px; color:#242424;}
.pagesr p{ width:auto; font-size:16px; line-height:20px; padding:5px 0px; color:#242424;}
.pagesr{ width:30%; float:right; text-align:right;}
.pagesl a{ color:#FFF; font-size:16px; padding:5px 10px; display:inline-block;
-moz-border-radius: 3px; /* Firefox */
-webkit-border-radius: 3px; /* Safari 和 Chrome */
border-radius: 3px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
background: #323232;
}
.pagesl a:hover{ color:#FFF; background:#b39b77;}
.pagesl i{ padding-right:5px;}
.pagesr a{ color:#FFF; font-size:16px; padding:5px 10px; display:inline-block;
-moz-border-radius: 3px; /* Firefox */
-webkit-border-radius: 3px; /* Safari 和 Chrome */
border-radius: 3px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
background: #323232;
-webkit-transition: 0.3s;-moz-transition: 0.3s;transition: 0.3s;
}
.pagesr i{ padding-right:5px;}
.pagesr a:hover{ color:#FFF; background:#b39b77; -webkit-transition: 0.3s;-moz-transition: 0.3s;transition: 0.3s;}

/*-- contact --*/
.contact{ width:100%; height: auto; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction: column;}
.cont-t{ width:100%; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.cont-t h1{ font-size: 32px; color: #000; font-weight: 600; padding: 10px 0px;}
.cont-a{ width:100%; height: auto; display:flex; justify-content: center; align-items:flex-start; flex-direction: row; padding: 50px 0px 40px;}
.conta-one{ width:25%; height: auto; padding:15px 0px; display: flex; flex-direction:column; align-items: center; justify-content: center; cursor: pointer; -webkit-transition:all 0.5s;-moz-transition:all 0.5s;transition:all 0.5s;}
.conta-one i{ width:115px; height: 115px; overflow: hidden; background-color: #404040; padding: 25px;
-moz-border-radius: 360px; /* Firefox */
-webkit-border-radius: 360px; /* Safari 和 Chrome */
border-radius: 360px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
-webkit-transition:all 0.5s;-moz-transition:all 0.5s;transition:all 0.5s;
}
.conta-one div{ width:100%; height:auto; display: flex; justify-content: flex-start; align-items: center; flex-direction: column; padding: 20px 0px 0px;}
.conta-one div h1{ font-size: 19px; color: #000; text-align: center; font-weight: bold; padding-bottom: 10px; }
.conta-one div p{ font-size: 19px; color: #000; text-align: center; }
.conta-one:hover i{ background-color: #b39b77; }

/*-- 地图 --*/
.cont-b{ width:100%; height: auto; display: flex; justify-content: center; align-items: center; flex-direction: column; padding-bottom: 60px;}
.mapbox{ width:100%; height:485px; float:left;}
#container{ width:100%; height:100%; float:left;}

/*-- footB --*/
.footB{ width:100%; height: auto; background-color:#adadad; float: left; overflow: hidden;}
.footup{ width:100%; height: auto; display: flex; justify-content: center; align-items: center; flex-direction: column; padding-bottom: 45px;}
.foot-a{ display: flex; padding: 35px 0px 28px;}
.foot-a i img{ max-width: 100%;}
.foot-b{ width:100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: row; padding:0px 38px;}
.foot-bone{ width:30%; display: flex; justify-content: flex-start; align-items:flex-start; flex-direction: column;}
.foot-info{ width:100%; display: flex;}
.foot-info ul{ width:100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column;}
.foot-info ul li{ width:100%; display: flex; justify-content:flex-start; align-items:center; flex-direction: row; padding:3px 0px;}
.foot-info ul li i{ width:40px; height: 20px; display: flex; justify-content:flex-start; align-items: center;}
.foot-info ul li p{ font-size: 19px; color: #524f46; }
.fshare{ width:100%; display: flex; justify-content: flex-start; align-items: center; flex-direction: row; padding-top:15px;}
.fshare h2{ font-size: 16px; color:#524f46; font-weight:600; padding-right: 10px;}
.fshare ul{ display: flex; }
.fshare ul li{ display: flex; justify-content: center; align-items: center; flex-direction: row;}
.fshare ul li a{ margin-right:2px; position: relative;}
.fshare ul li a img{ width:33px; height:33px; position:relative; z-index: 1;}
.fshare ul li a i{ position:absolute; left: 4px; top:4px; width:24px; height:24px; background: #FFF;}
.foot-btwo{ width:40%; height: auto; padding-right:5%; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column;}
.foot-btwo h1{ font-size: 19px; color:#524f46; font-weight:600; display:flex; justify-content: flex-start; align-items: center; flex-direction: column; padding: 10px 0px;}
.foot-btwo p{ width: 100%; font-size: 19px; color:#524f46; display:flex; justify-content: flex-start; align-items:flex-start; flex-direction: row; margin-top:5px; }
.foot-btwo p i{ width:30px; height:30px;}
.foot-btwo p i svg{ width:100%;}
.foot-btwo p span{ font-size: 19px; padding-left:7px; padding-top:2px;}
.foot-bth{width:25%; height: auto; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column;}
.foot-bth h1{ font-size: 19px; color:#524f46; font-weight:600; display:flex; justify-content: flex-start; align-items: center; flex-direction: column; padding: 10px 0px;}
.foot-bth ul{ width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-direction: row; flex-wrap: wrap; }
.foot-bth ul li{ width: 33.33%; display: flex; justify-content:flex-start; align-items: center; flex-direction: row;}
.foot-bth ul li a{ width: 100%; font-size: 19px; color:#524f46; display:flex; justify-content: flex-start; align-items:flex-start; flex-direction: row; -webkit-transition:all 0.5s;-moz-transition:all 0.5s;transition:all 0.5s;}
.foot-bth ul li a:hover{ color: #000; text-decoration: underline; }
.footdown{ width:100%; height:auto; float:left; padding:18px 0px; line-height:25px; font-size:16px; color:#adadad; text-align:center; position:relative; display: flex; flex-direction:row; align-items: center; justify-content:center; background-color: #524f46;}
.footdown span{ padding:0px 10px; }
.footdown a{ color:#adadad; }


/* ~~ 脚注 ~~ */
@-webkit-keyframes movel {   
0% { background-position: 50% 30%;}
50% { background-position: 50% 70%;}
100% { background-position: 50% 30%;}
}

@-moz-keyframes movel {
0% { background-position: 50% 30%;}
50% { background-position: 50% 70%;}
100% { background-position: 50% 30%;}
}

@keyframes movel {
0% { background-position: 50% 30%;}
50% { background-position: 50% 70%;}
100% { background-position: 50% 30%;}
}

.bigs,.goban .inbg{
-webkit-animation-timing-function: linear;    /*动画时间曲线*/
-webkit-animation-name: bigss;                  /*动画名称，与@keyframes搭配使用*/
-webkit-animation-duration: 35000ms;              /*动画持续时间*/
-webkit-animation-iteration-count: infinite;    /*动画要重复次数*/
-webkit-animation-direction: alternate; /*动画执行方向，alternate 表示反复*/
-moz-animation-timing-function: linear;  /*动画时间曲线*/
-moz-animation-name: bigss;                  /*动画名称，与@keyframes搭配使用*/
-moz-animation-duration: 35000ms;              /*动画持续时间*/
-moz-animation-iteration-count: infinite;    /*动画要重复次数*/
-moz-animation-direction: alternate; /*动画执行方向，alternate 表示反复*/
animation-timing-function: linear;  /*动画时间曲线*/
animation-name: bigss;                  /*动画名称，与@keyframes搭配使用*/
animation-duration: 35000ms;              /*动画持续时间*/
animation-iteration-count: infinite;    /*动画要重复次数*/
animation-direction: alternate; /*动画执行方向，alternate 表示反复*/
}

@-webkit-keyframes bigss{0%{-webkit-transform:scale(1)}100%{-webkit-transform:scale(1.4)}}@-moz-keyframes bigss{0%{-moz-transform:scale(1)}100%{-moz-transform:scale(1.4)}}@keyframes bigss{0%{transform:scale(1)}100%{transform:scale(1.4)}}

.bigs .flaotbox,.goban h1{
-webkit-animation-timing-function: linear;    /*动画时间曲线*/
-webkit-animation-name: fadeInDown;                  /*动画名称，与@keyframes搭配使用*/
-webkit-animation-duration: 1200ms;              /*动画持续时间*/
/*-webkit-animation-iteration-count: infinite;    动画要重复次数*/
-moz-animation-timing-function: linear;  /*动画时间曲线*/
-moz-animation-name: fadeInDown;                  /*动画名称，与@keyframes搭配使用*/
-moz-animation-duration: 1200ms;              /*动画持续时间*/
/* -moz-animation-iteration-count: infinite;    动画要重复次数*/
animation-timing-function: linear;  /*动画时间曲线*/
animation-name: fadeInDown;                 /*动画名称，与@keyframes搭配使用*/
animation-duration: 1200ms;              /*动画持续时间*/
/* animation-iteration-count: infinite;    动画要重复次数*/
 /*animation-direction: alternate; 动画执行方向，alternate 表示反复*/
}
.goban h1,.goban .btns{
-webkit-animation-timing-function: linear;    /*动画时间曲线*/
-webkit-animation-name: fadeIn;                    /*动画名称，与@keyframes搭配使用*/
-webkit-animation-duration: 1600ms;              /*动画持续时间*/
/*-webkit-animation-iteration-count: infinite;    动画要重复次数*/
-moz-animation-timing-function: linear;  /*动画时间曲线*/
-moz-animation-name:fadeIn;                 /*动画名称，与@keyframes搭配使用*/
-moz-animation-duration: 1600ms;              /*动画持续时间*/
/* -moz-animation-iteration-count: infinite;    动画要重复次数*/
animation-timing-function: linear;  /*动画时间曲线*/
animation-name:fadeIn;               /*动画名称，与@keyframes搭配使用*/
animation-duration: 1600ms;              /*动画持续时间*/
/* animation-iteration-count: infinite;    动画要重复次数*/
 /*animation-direction: alternate; 动画执行方向，alternate 表示反复*/
}
.goban h2,.goban i{
-webkit-animation-timing-function: linear;    /*动画时间曲线*/
-webkit-animation-name: fadeInRight;                /*动画名称，与@keyframes搭配使用*/
-webkit-animation-duration: 1000ms;              /*动画持续时间*/
/*-webkit-animation-iteration-count: infinite;    动画要重复次数*/
-moz-animation-timing-function: linear;  /*动画时间曲线*/
-moz-animation-name: fadeInRight;                /*动画名称，与@keyframes搭配使用*/
-moz-animation-duration: 1000ms;              /*动画持续时间*/
/* -moz-animation-iteration-count: infinite;    动画要重复次数*/
animation-timing-function: linear;  /*动画时间曲线*/
animation-name: fadeInRight;                 /*动画名称，与@keyframes搭配使用*/
animation-duration: 1000ms;              /*动画持续时间*/
/* animation-iteration-count: infinite;    动画要重复次数*/
 /*animation-direction: alternate; 动画执行方向，alternate 表示反复*/
}

@-webkit-keyframes float-up-down {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@-moz-keyframes float-up-down {
  0% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
  50% {
    -moz-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes float-up-down {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
  100% {
    transform: translateY(0);
  }
}

.sythone {
  -webkit-animation-name: float-up-down;
  -webkit-animation-duration: 4s;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-name: float-up-down;
  -moz-animation-duration: 4s;
  -moz-animation-timing-function: ease-in-out;
  -moz-animation-iteration-count: infinite;
  animation-name: float-up-down;
  animation-duration: 4s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  display: flex;
  align-items: center;
}


/*-- 左侧 --*/
.footside{position:fixed!important; width:60px; height:auto; right:0; top:45%; z-index:8;}
.footside ul li{ width:60px; height:60px; float:left; position:relative; margin-top:1px; list-style:none; background:#242424; color:#FFF;
-moz-border-radius: 10px 0px 0px 10px; /* Firefox */
-webkit-border-radius: 10px 0px 0px 10px; /* Safari 和 Chrome */
border-radius: 10px 0px 0px 10px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */ 
}
.footside ul li .sidetop{ width:60px; height:60px; display:inline-block; background:#242424; transition:all 0.3s;}
.footside ul li .sidetop:hover{ background:#ecc7aa; opacity:1; filter:Alpha(opacity=100);}
.footside ul li a{ position:absolute; width:60px; height:60px; top:0; right:0; background:#242424; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s; line-height:60px; color:#FFF; font-size:17px;}
.footside ul li a>i{ float:left; width:60px; height:60px; text-align: center; }
.footside ul li a span{ display:none;}
.footside ul li a span img{ width:100%;}
.footside ul li img{ max-width:100%; float:left;}
#cmail:hover a{ width:155px; background:#ecc7aa; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s; overflow:hidden;}
#cmail:hover a span{ display:block;}

.footside ul li div>i{ width:120px; position: absolute; right: 0; top:0; z-index: 1;}
.footside ul li div>i img{ width:100%;}
.footside ul li div{ width:60px; height:60px; color: #FFF; display: table; background: #ecc7aa; text-align: center; position:absolute; right: 0; top: 0; visibility: hidden; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0;transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s;}
.footside ul li:hover div{ width:120px; text-align: center; height:auto; visibility: visible; right: 100%;  filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity:1; opacity:1; transition: 0.6s; -webkit-transition: 0.6s;-moz-transition: 0.6s;}
#topcontrol{ z-index: 3;}

/*-- --*/
.furight{ position:fixed; right:20px; top:35%; width:80px; height:auto; z-index:101; background:#FFF; padding:10px 0px;
-moz-border-radius: 5px; /* Firefox */
-webkit-border-radius: 5px; /* Safari 和 Chrome */
border-radius: 5px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
filter:progid:DXImageTransform.Microsoft.Shadow(color=#dddcdc,direction=120,strength=4);/*兼容ie*/
-moz-box-shadow:0px 0px 3px 0px #dddcdc;/*兼容firefox*/
-webkit-box-shadow:0px 0px 3px 0px #dddcdc;/*兼容safari或chrome*/
box-shadow:0px 0px 3px 0px #dddcdc;/*兼容opera或ie9*/
}
.furight ul li{ width:100%; height:auto; float:left;}
.furight ul li i{ width:100%; height:auto; float:left; text-align:center; padding:5px 0px;}
.furight ul li i img{ max-width:100%;}
.furight ul li p{ width:100%; height:auto; float:left; text-align:center; font-size:14px; color:#4a4a4a; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s; padding:2px 0px 5px;}
.furight ul li a:hover p{ color:#00c1b4; transition: 0.6s;-webkit-transition: 0.6s;-moz-transition: 0.6s;}
.furight.fen p{ font-size:12px;}

.furightB, .furightB2, .furightB3{ width:100%; height:100%; position:fixed; z-index:102; display:none;}
.ftB-bg{ width:100%; height:100%; position:absolute; top:0; left:0; background:#000;  filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity:0.5; opacity:0.5;}
.ftb-show{ width:100%; height:auto; float:left; top:12%; text-align:center; z-index:1; position:relative;}
.ftb-m{ max-width:500px; height:auto; display:inline-block; background:#FFF; border:1px solid #a6a6a6;
-moz-border-radius: 5px; /* Firefox */
-webkit-border-radius: 5px; /* Safari 和 Chrome */
border-radius: 5px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
}
.ftb-mt{ width:100%; height:auto; float:left; padding:15px; border-bottom:1px solid #a6a6a6;}
.ftb-mt p{ width:80%; float:left; font-size:16px; text-align:left;}
.ftb-mt i{ width:20px; height:20px; float:right; position:relative; cursor:pointer;}
.ftb-mt i:before{ content:""; width:18px; height:2px; background:#000; position:absolute; right:9px; top:10px; cursor:pointer;
transform:rotate(45deg);
-ms-transform:rotate(45deg); 	/* IE 9 */
-moz-transform:rotate(45deg); 	/* Firefox */
-webkit-transform:rotate(45deg); /* Safari 和 Chrome */
-o-transform:rotate(45deg); 	/* Opera */
}
.ftb-mt i:after{ content:""; width:18px; height:2px; background:#000; position:absolute; right:9px; top:10px; cursor:pointer;
transform:rotate(-45deg);
-ms-transform:rotate(-45deg); 	/* IE 9 */
-moz-transform:rotate(-45deg); 	/* Firefox */
-webkit-transform:rotate(-45deg); /* Safari 和 Chrome */
-o-transform:rotate(-45deg); 	/* Opera */
}
.ftb-in{ width:100%; height:auto; text-align:center; padding:15px; float:left;}
.ftb-in i{ width:100%; height:auto; float:left; padding:15px 20px 5px;}
.ftb-in i img{ max-width:100%;}
.ftb-in p{ font-size:14px; width:100%; height:auto; padding:10px 0px; float:left;}

/*-- 弹出框 --*/
.cctt{ width:100%; height: auto; float:left; font-weight: 600; color: #FFF; }
.modal-header .close{ padding: 0;  margin: 0; float: right; position: absolute; right: 15px; }
.jjbg{ background:#021f3d; }
#jj .close span{ padding:0px 2px;  margin: 0; float: right; background-color: #ffffff;}
.tops{ top:15%;}
.incpbox{ width:100%; height: auto; float: left; padding: 5px 0px; }
.incp-t{ width:100%; height: auto; float: left; font-size: 16px; color:#000; line-height: 25px; }
.incp-t i{ color:red; float: left; padding-right: 10px; font-style: normal;}
.incp-x{ width:100%; height: auto; float: left}
.incp-x input{ width:100%; height: auto; border: 2px solid #242424; padding: 8px; font-size: 14px; color: #000;
-moz-border-radius: 5px; /* Firefox */
-webkit-border-radius: 5px; /* Safari 和 Chrome */
border-radius: 5px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
}
.incp-tx{ width:100%; height:100px; float:left;}
.incp-tx textarea{ width:100%; height: 100%; border: 2px solid #242424; padding:8px; font-size: 14px; color: #000; resize: none;
-moz-border-radius: 5px; /* Firefox */
-webkit-border-radius: 5px; /* Safari 和 Chrome */
border-radius: 5px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
}
.incpbtn{ width:100%; height: auto; float: left; padding: 20px 0px 10px;}
#ttcp{ width:120px; height:35px; background:#021f3d; display:inline-block; cursor:pointer; border:0; font-size:14px; color:#FFF; outline: none;
-moz-border-radius: 2px; /* Firefox */
-webkit-border-radius: 2px; /* Safari 和 Chrome */
border-radius: 2px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
transition:0.6s; -webkit-transition: 0.6s; -moz-transition: 0.6s;
}
#ttcp:hover{ background:#242424; color:#FFF; transition:0.6s; -webkit-transition: 0.6s; -moz-transition: 0.6s;}