﻿@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: "DFST-G7";
  src: url("../fonts/DFST-G7.woff2") format("woff2"),
       url("../fonts/DFST-G7.woff") format("woff"),
       url("../fonts/DFST-G7.ttf") format("truetype"),
       url("../fonts/DFST-G7.eot") format("embedded-opentype"),
       url("../fonts/DFST-G7.svg") format("svg");
}


html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite, code,del,dfn,em,img,ins,kbd,q,samp,small,strong,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio, video{ margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; outline-style:none;/*FF*/font-size:10px;  font-family: "Arial","Microsoft Yahei";  list-style:none;}
body { line-height:1; }
a{ margin:0; padding:0; border:0; font-size:100%; vertical-align:baseline; background:transparent;text-decoration:none; color:#333; cursor:pointer;outline:0;}
a:hover,a:focus{ text-decoration:none;  outline-style:none;/*FF*/ }
table { border-collapse:collapse; border-spacing:0;}
input, select {vertical-align:middle;}
/*css为clearfix，清除浮动*/
.clearfix::before,.clearfix::after{content:""; height:0; line-height:0; display: block;visibility: hidden; clear:both;}
.clearfix:after{clear:both;} 
.clearfix{*zoom:1;/*IE/7/6*/}

.warp{ max-width:100%; padding:0 85px;  margin:0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.warp2{ max-width:1500px; padding:0 20px;  margin:0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.clear{ overflow:hidden;}
.clear2{ clear:both;}

h1,h2,h3,h4,h5,h6{ font-weight:normal;}
.play{transition:linear .5s all;-moz-transition: linear .5s all; -webkit-transition:linear .5s all; -o-transition: linear .5s all;} 

/*all-img*/
.xxl,icu1{ display:block;}
.xl,.l,.m,.icu2{ display:none;}

/*parts*/
div.fy {text-align:center;line-height:4rem; padding-top:20px;}
div.fy a { margin:2px 2px;padding:8px 12px;color:#666;font-size:1.4em; display:inline; background: #fff; border: 1px solid #ddd;}
div.fy a:hover{color:#fff;  background: #ac8d6b; border: 1px solid #ac8d6b;}
div.fy a:active{ color:#fff;  background: #ac8d6b; border: 1px solid #ac8d6b;}
div.fy span.current{  margin:2px 2px;padding:8px 12px; color:#fff;  font-size:1.4em;  background: #ac8d6b;border: 1px solid #ac8d6b;}
div.fy span.disabled{  margin:2px 2px;padding:8px 12px; color:#666; font-size:1.4em; background: #fff;  border: 1px solid #ddd;}


/*手机导航*/
.m-header{ width:100%; background:#fff;}
#m1 #hamburger{position:fixed;}
#hamburger {width: 24px; height: 14px;	position:absolute;	top: 25px;	right: 25px;	z-index: 999;display: none !important;}
#hamburger:before, #hamburger:after, #hamburger span { background:#fff; content: ''; display: block;    width: 20px;  height: 2px;}
#hamburger span {	margin: 4px 0 0 0;}
#hamburger:after {	margin: 4px 0 0 0;}
#hamburger.hb-fixed {	position: fixed;}
/* Hamburger animation */
#hamburger:before, #hamburger:after, #hamburger span {	-webkit-transition: none 0.3s ease 0.3s;	transition: none 0.3s ease 0.3s;	-webkit-transition-property: transform, top, bottom, left, opacity, margin;	transition-property: transform, top, bottom, left, opacity, margin;}
html.mm-opening #hamburger:before, html.mm-opening #hamburger:after {top: 20px;}
html.mm-opening #hamburger span {	left: -50px;	opacity: 0;}
html.mm-opening #hamburger:before {	transform: rotate( 45deg );	margin: 7.5px 0 0 0;}
html.mm-opening #hamburger:after {	transform: rotate( -45deg );margin: -7.5px 0 0 0;}
/*弹出input*/
.overCurtain {position: fixed; top:20px; right:40px; height:40px; width:40px;display:none; opacity:1; z-index:1000; cursor:pointer;}
.hide-center {background-color:#444;  position:fixed; z-index:999; display:none; width:100%; height:100%; top:0; left: 0;}
.hide-center .boxs{ display:table; width:100%; height:100%;}
.hide-center .box{ display:table-cell; vertical-align:middle; padding:0 20px;}
.field__input{ float:left; width:100%; border:none; outline:none; height:60px; padding:20px 160px; font-size:3.2em; font-weight:bold; color:#fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align:center; border-bottom:1px solid #ccc; background-color: transparent;}
.m-btn{ float:left;border:none; outline:none; background-color: transparent; padding:19.5px; height:60px; font-size:1.6em; font-weight:bold; color:#fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width:140px; position:absolute; right:40px; text-transform:uppercase;}
.s-close { width:40px; height:40px; transition:linear .5s all;-moz-transition: linear .5s all; -webkit-transition:linear .5s all; -o-transition: linear .5s all; font-size:0px; margin-top:20px;	display:block;}
.s-close::before,.s-close::after {	content:'';	width:40px;	height:2px;	background:#FFF;	display:block; transition:linear .5s all;-moz-transition: linear .5s all; -webkit-transition:linear .5s all; -o-transition: linear .5s all;}
.s-close::before {	-webkit-transform:rotate(45deg);	transform:rotate(45deg);}
.s-close::after {	-webkit-transform:translateY(-2px) rotate(-45deg);	transform:translateY(-2px) rotate(-45deg);}
.s-close:hover:before{transform:rotate(90deg);}
.s-close:hover:after{ transform:rotate(0deg);}

.overCurtain2 .s-close{ float: right; top:20px; right: 20px; position: absolute;}
.overCurtain2 {position: fixed; top: 0;    bottom: 0;    left: 0;    right: 0;width:100%;display:none; background-color:#000; opacity:0.7; z-index:999;}
.hide-center2 {position:fixed;right:0;left:0;	bottom:0;	top:20%;margin:auto;	display:none;	z-index:1000;	width: 100%;   max-width: fit-content;	}

/*header*/
.header,.header .mune a,.header .m-list>a img,.header .more a,.header .mune .hid-box,.header .mune .hid-mune span:last-child:after,.header .mune .hid-mune span:last-child:before{transition:ease .5s all;-moz-transition: ease .5s all; -webkit-transition:ease .5s all; -o-transition: ease .5s all;}
#m1 .header{ background: transparent; z-index: 2;  position: fixed; left: 0; width: 100%; top:0%; width: 100%;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.header{ background: #000;}

.header .logo{ padding: 32px 0; float:left; }
.header .munes{  float:right;}
.header .mune{ padding: 30px 0; float:left; overflow: hidden; }
.header .mune>*,.header .m-list{ float:left; }
.header .m-list>a{ display: inline-block;  font-size:1.4em; color:#fff; padding:0 30px; line-height:22px; position: relative;}
.header .m-list:hover>a,#m1 .m1,#m2 .m2,#m3 .m3,#m4 .m4,#m5 .m5,#m6 .m6,#m7 .m7{ color: #ac8d6b !important; }
.header .mune .hid-box{ opacity: 0; transform: translateX(1200px);}
.header .mune .hid-mune{  cursor:pointer; position: relative; z-index: 2; overflow: hidden; padding: 2px 0;}
.header .mune .hid-mune span{ float:left;}
.header .mune .hid-mune span:last-child{ margin-left: 10px; display: inline-block; width:  40px; height: 14px; position: relative;}
.header .mune .hid-mune span:last-child:after,.header .mune .hid-mune span:last-child:before{ position:absolute; content: ""; width: 40px; height: 1px; background: #fff; left: 0;}
.header .mune .hid-mune span:last-child:after{ top:2px;}
.header .mune .hid-mune span:last-child:before{ width: 26px; bottom: 0px;}
.header .mune .hid-mune.close span:last-child:before,.header .mune .hid-mune.close span:last-child:after{ top:50%; width: 100%;}
.header .mune .hid-mune.close span:last-child:before{transform: rotate(30deg);}
.header .mune .hid-mune.close span:last-child:after{transform: rotate(-30deg);}
.header .mune .ms{ transform: translateX(0px); opacity: 1; }

.header .lun{ float:left;}
.header .lun a{ color: #fff; font-size: 1.6em; line-height: 1.5;  margin-left: 20px; padding: 30px 0; display: inline-block;}

/*footer*/
.footer a,.footer  .right  .btn .fc-btn,.footer .links img{transition:ease .5s all;-moz-transition: ease .5s all; -webkit-transition:ease .5s all; -o-transition: ease .5s all;}
#m1 .footer{ height: 35vh;}
.footer{ background: #0f0f0f;}
.footer{ overflow:hidden;padding: 60px 0 30px 0;}
.footer .warp{ display: table; width: 100%;}
.footer .warp>*{ padding: 10px 0 20px 0; display: table-cell; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.footer .txt{ padding: 3% 20px; border-right: 1px solid #848382; width: 265px; text-align: center;}
.footer .txt img{ max-width: 96%;}
.footer .links{ border-right: 1px solid #848382; padding: 10px 2% 20px 2%; width: calc(100% - 560px); overflow: hidden;}
.footer .links .lid{ width: 15%; float:left; padding: 0 16px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.footer .links .lid:last-child{ width: 25%;}
.footer .links h3 a{ display: inline-block; font-size: 1.6em; color: #848382; margin-bottom: 20px; font-weight: bold; }
.footer .links p a,.footer  .links p{  font-size: 14px; color: #848382; line-height: 2;}
.footer .links p img{ margin: 10px 6px 0 0;}
.footer .links p a{ display: inline-block;}
.footer .links a:hover img{ transform: scale(0.8);}
.footer .links a img:hover{ transform: scale(1);}
.footer .links p a:hover,.footer .links h3 a:hover{ color: #fff;}
.footer .links .fss{ margin-top: 20px;}
.footer .links .fss a{ position: relative; margin-right: 6px;}
.footer .links .fss a .fs{ position: absolute; top:-60px;  left: -60px; width: 120px; z-index: 2; display: none;}
.footer .links .fss a:hover .fs{ display: block;}
.footer .links .fss a .fs img{ max-width: 100%;}

.footer .two{ width: 240px; padding: 20px 20px 20px 20px; text-align: center; }
.footer .two img{ max-width: 96%;margin-bottom: 12px;}
.footer .two p{ font-size: 1.2em; color: #ac8d6b; line-height: 22px; font-weight: 100; }

.bottomlist{ background:#000; position:fixed; width:100%; bottom:0; left:0;  display:none; z-index:200;}
.bottomlist ul{ width:100%;}
.bottomlist ul li{ width:33.33%; float:left; text-align:center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding:5px;}
.bottomlist>ul>li>a>div{ font-size:1.6em; color:#fff;}
.bottomlist ul li img{ width:40px; height:40px;}


#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span{ background: #fff; border: 1px solid #fff;}
#fp-nav ul li a span, .fp-slidesNav ul li a span{ border: 1px solid #7f7f7f;}
#fp-nav.right{ right: 40px;}

/*banner*/
.banner *{transition:ease-out 0.4s all;-moz-transition: ease-out 0.4s all; -webkit-transition:ease-out 0.4s all; -o-transition: ease-out 0.4s all;}
.banner{ background: #000; height: 100vh; text-align: center;   display: -webkit-box;  display: -ms-flexbox; display: -webkit-flex;  display: flex; -webkit-box-pack: center;   -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center;  -webkit-box-align: center; -ms-flex-align: center;  -webkit-align-items: center; align-items: center;  -webkit-transform: translateZ(100px);}
.banner .btn span{ bottom: 6vh; left: calc(50% - 15px); position: absolute; width: 30px; height: 50px; border: 2px solid #fff; border-radius: 20px; display: inline-block; margin-top: 3vh; animation:move 3s linear infinite;}
.banner .btn span:after{ position: absolute; width: 2px; height: 6px; content: ""; display: inline-block; left: 0; right: 0; top:6px; margin: 0 auto; background: #fff; animation:move 3s linear infinite;}
.banner .ad{ position: relative; z-index: 3;}
.banner .layer{ max-height: 80vh;}
.banner .layer img{max-height: 60vh; max-width: 60vh; max-width: 80%;}
.banner .layer-2,.banner .layer-3{ position: absolute; top:0; left: 0; width: 100%; text-align: center;}
.banner video{ opacity: 0.4; left: 0; position: absolute; top:0; background-attachment: fixed; background-size: cover !important; height: 100vh;  object-fit:cover;}

@keyframes move {
	0% { transform: translateY(0px);}
	99% { transform: translateY(20px); opacity: 0.6;}
	100% { transform: translateY(0px); opacity: 1;}
}
@keyframes move2 {
	0% { transform: translateY(0px);}
	99% {transform: translateY(90px); opacity: 0.4;}
	100% {transform: translateY(0px); opacity: 1;}
}
/*ibrand*/
.ibrand .brand-box .brand-tip .brand-t:before,.ibrand .brand-box .brand-tip .brand-t:after,.ibrand .brand-box .brand-tip .brand-t a:before,.ibrand .brand-box .brand-tip .brand-t:after,.ibrand .brand-box .brand-tip:after{transition:ease .5s all;-moz-transition: ease .5s all; -webkit-transition:ease .5s all; -o-transition: ease .5s all;}
.ibrand{ background: #000;}
.ibrand .brand-box{ height: 100vh;  float:left; width: 33.33%; background-size: cover !important; display: table; }
.ibrand .brand-box.box1{ background: url(../images/ibrand1.jpg) center center no-repeat; }
.ibrand .brand-box.box2{ background: url(../images/ibrand2.jpg) center center no-repeat; }
.ibrand .brand-box.box3{ background: url(../images/ibrand3.jpg) center center no-repeat; }
.ibrand .brand-box .brand-tip{ position: relative; vertical-align: middle; text-align: center; display: table-cell; width: 100%; height: 100%;}
.ibrand .brand-box .brand-tip:after{ content: ""; position: absolute; top:0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.8; z-index: 0;}
.ibrand .brand-box .brand-tip .brand-t{position: relative;z-index:  2;   width: 100%;  max-width: 460px; margin: 0 auto; padding: 110px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.ibrand .brand-box .brand-tip .brand-t img{ max-width: 100%; margin: auto;  display: block;}
.ibrand .brand-box .brand-tip .brand-t img.b{ display: none;}

.ibrand .brand-box .brand-tip:hover:after{ transform: scaleY(0.24); }
.ibrand .brand-box .brand-tip:hover .brand-t img.a{ display: none;}
.ibrand .brand-box .brand-tip:hover .brand-t img.b{ display: block;  }

/*ivideos*/
.ivideos{ background: #0f0f0f;  }
.ivideos .ivideos-slider .iv-logo1{  background: url(../images/iv-logo1.png) left bottom no-repeat; background-size: 10% ;}
.ivideos .ivideos-slider .iv-logo2{  background: url(../images/iv-logo2.png) left bottom no-repeat; background-size: 7% ;}
.ivideos .ivideos-slider .iv-logo3{  background: url(../images/iv-logo3.png) left bottom no-repeat; background-size: 7% ;}
.ivideos .ivideos-slider .swiper-slide{ padding: 0 10%;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.ivideos .ivideos-slider .swiper-slide img{ max-width: 100%; max-height: 80vh; margin: 0 auto; display: block;}
.ivideos .ivideos-slider .swiper-button-white{ width: 50px; height: 100px; background-size: 50px 100px; z-index: 2;}
.ivideos .ivideos-slider .ivideos-prev{ background-image: url(../images/v-p.png);}
.ivideos .ivideos-slider .ivideos-next{ background-image: url(../images/v-n.png);}
.ivideos .ivideos-slider .ivideos-prev,.ivideos .ivideos-slider .ivideos-next{ width: 35px; height: 71px; background-size: 35px 71px;}



/*iphotos*/
.iphotos{ background: #1c1c1c;}
.iphotos .iphotos-slider{ padding: 0 100px 2% 100px;}
.iphotos .iphotos-slider .tips{ width: 100%; z-index: 200; position: absolute; bottom: 0; left: 120px; -webkit-transform: translateZ(100px);}
.iphotos .iphotos-slider .tips img{ max-width: 60%; }
.iphotos .iphotos-slider .swiper-slide{ overflow: hidden; padding: 0 15% 0 0%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.iphotos .iphotos-slider .swiper-slide.swiper-slide-active{ padding: 0 0% 0 15%;}
.iphotos .iphotos-slider .swiper-slide img{ max-width: 100%; max-height: 80vh;}
.iphotos .iphotos-slider .swiper-slide>*{ float:left;}
.iphotos .iphotos-slider .swiper-slide a{ width: 60%;}
.iphotos .iphotos-slider .txt{ width: 40%; padding: 20px; background: #1c1c1c;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.iphotos .iphotos-slider .txt .t1{ margin-bottom: 8%;  height: 168px; display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden; -webkit-line-clamp:4;}
.iphotos .iphotos-slider .txt h3{ font-size: 1.6em; line-height: 42px; color: #fff;}
.iphotos .iphotos-slider .txt .t2{  height: 144px; }
.iphotos .iphotos-slider .txt p{ font-size: 1.2em; color: #848484; line-height: 36px; font-style: italic; font-weight: 100; }
.iphotos .iphotos-slider .btn{ z-index: 204; position: absolute; right: 24.5%;  bottom:12%;  width: 200px; height: 60px;}
.iphotos .iphotos-slider .btn .iphotos-prev{ background-image: url(../images/v-p.png);}
.iphotos .iphotos-slider .btn .iphotos-next{ background-image: url(../images/v-n.png);}
.iphotos .iphotos-slider .btn .iphotos-prev,.iphotos .iphotos-slider .btn .iphotos-next{ width: 22px; height: 40px; background-size: 22px 40px;}

/*ift*/
.ift .feedback{padding: 14vh 0;background: #d7d7d7;height: 65vh;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.ift .feedback .tit{text-align: center;margin-bottom: 40px;}
.ift .feedback .tit h3{ font-size: 2.6em; font-weight: 200; letter-spacing: 16px; color: #222; margin-bottom: 16px;}
.ift .feedback .tit h4{ text-transform: uppercase;  font-size: 2em; color: #888; font-weight: 100; letter-spacing: 12px;}
.ift .feedback input{ width: 100%; font-size: 1.4em; outline:none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  line-height:22px; color:#333; background: #d7d7d7; border: 1px solid #2f2f2f;  padding:10px 16px;}
.ift .feedback .dots{ max-width: 1280px; margin: 0 auto; overflow: hidden;}
.ift .feedback .dots .dot{ float:left; width: calc(33.33% - 50px); margin: 2% 25px;}
.ift .feedback .dots .dot p{font-size: 1.4em;color: #888;line-height: 32px;}
.ift .feedback .btn{ text-align: center; }
.ift .feedback .fc-btn{padding: 10px 0;width: auto;margin: 25px auto 0 auto;font-size: 1.6em;color: #000; border:none;border-bottom: 1px solid #424242;}

.ift .feedback input::-webkit-input-placeholder { color:#8c8c8c;}
.ift .feedback input:-moz-placeholder { color:#8c8c8c;}
.ift .feedback input::-moz-placeholder { color:#8c8c8c;}
.ift .feedback input:-ms-input-placeholder { color:#8c8c8c;}


/*brand*/
.b-list a{transition:ease-out 0.4s all;-moz-transition: ease-out 0.4s all; -webkit-transition:ease-out 0.4s all; -o-transition: ease-out 0.4s all;}
.b-top{ padding: 18px 0 14px 0; text-align: right; border-bottom:2px solid #000;}
.brand-box .bb{ overflow: hidden; margin-bottom: 50px;  border-bottom:2px solid #000; } 
.brand-box .bb>*{ float:left; width: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.brand-box .bb .imgs{ padding-right: 10%;}
.brand-box .bb .imgs img{ max-width: 100%;}
.brand-box .bb .imgs .swiper-pagination-bullet{ width: 10px; height: 10px; border: 1px solid #fff; background: transparent; opacity: 1; margin: 0 10px;}
.brand-box .bb .imgs .swiper-pagination-bullet-active{ background: #fff;}
.brand-box .bb .txts{ padding: 16% 5% 5% 0;}
.brand-box .bb .txts .txt{ max-width: 90%; margin: 6% 0 8% 0; max-height: 420px; overflow-y: scroll;}
.brand-box .bb .txts .txt .d{ max-width: 92%; margin-bottom: 40px;}
.brand-box .bb .txts .txt h4 {
    font-size:1.6em;
    font-weight:bold;
    margin-bottom:10px
}
.brand-box .bb .txts .txt .d h3{ font-size: 2em; font-weight:bold;  color: #ac8d6b; line-height: 1.5; margin-bottom: 30px;}
.brand-box .bb .txts .txt .d p{ font-size: 1.4em; line-height: 2.5; color: #666;}
.brand-box .bb .txts .txt .d:last-child{ margin-bottom: 0;}
#style-1::-webkit-scrollbar-track {
	background-color:#eae7e4;}
#style-1::-webkit-scrollbar {
	width:4px;	background-color:#eae7e4;}
#style-1::-webkit-scrollbar-thumb {
	background-color:#999;}
.brand-box .bb .txts .bc{ overflow: hidden; }
.brand-box .bb .txts .bc p{ float:left; font-size: 1.6em; color: #000; font-weight: bold;}
.brand-box .bb .txts .bc p:last-child{ float:right; }

.b-list{ margin-top: 40px;}
.b-list a{ font-size: 1.8em; color: #999; display: inline-block; border-left: 1px solid #999; padding:0 20px;}
.b-list a:first-child{ padding-left: 0; border-left:none;}
.b-list a:hover,.b1 .b1,.b2 .b2,.b3 .b3,.b4 .b4{ color: #333; }

/*tits*/
 .tits h3{ font-size: 3.6em; color: #000; line-height: 1.5;}
 .tits h4{ font-size: 2.4em; color: #000; line-height: 1.2; margin-top: 16px;}
.tits h4 span{ font-size: 1em; font-weight: 100;}

/*product*/
.product .pb-boxs .pboxs .p-links a,.product .pb-boxs .pboxs .p-links a:after,.product .pb-boxs .dots .dot .img img{transition:ease-out 0.4s all;-moz-transition: ease-out 0.4s all; -webkit-transition:ease-out 0.4s all; -o-transition: ease-out 0.4s all;}
.product .p-list{ padding: 90px 0; border-bottom: 2px solid #000;}
.product .p-list .imgs{ position: relative;}
.product .p-list .pban-slider{ max-width: 60%; margin: 0 auto; overflow: hidden;}
.product .p-list .pban-slider .swiper-slide{ text-align: center;}
.product .p-list .pban-slider .swiper-slide img{ max-width: 100%;}
.product .p-list .btn{ position: absolute; bottom: 0; left: 0; width: 100%; height: 20px;}
.product .p-list .btn a{ display:inline-block; height: auto; top:auto; bottom: 0; font-size: 2em; background: transparent;}
.product .p-list .btn a:last-child{ float:right;}
.product .p-list .txt{ max-width: 870px; margin: 0 auto; text-align: center; text-transform: uppercase; }
.product .p-list .txt h3{ line-height: 1.4; color: #333; font-weight: 100; padding: 60px 0 40px 0; font-size: 6.2em;}
.product .pb-boxs{ padding: 40px 0 100px 0;}
.product .pb-boxs .tit h3{ font-size: 2em; color: #000; font-weight: bold; font-style: italic; }
.product .pb-boxs .tit h3 span{ margin-left: 10px; font-size: 1em; color: #828282; font-weight: 100;}
.product .pb-boxs .pboxs{ padding: 100px 0 40px 0;}
.product .pb-boxs .pboxs .p-links{ text-align: center;}
.product .pb-boxs .pboxs .p-links a{ position: relative; display: inline-block; margin: 0 20px;}
.product .pb-boxs .pboxs .p-links a:after{ transform: scaleX(0); position: absolute;  bottom: 0; left: 0; width: 100%; content: ""; background: #eae7e4;}
.product .pb-boxs .pboxs .p-links .links1 a:after{ height: 2px; }
.product .pb-boxs .pboxs .p-links .links2 a:after{ height: 4px;}
.product .pb-boxs .pboxs .p-links .links1{ padding-bottom: 40px;}
.product .pb-boxs .pboxs .p-links .links1 a{ padding:6px 10px; font-size: 1.8em;}
.product .pb-boxs .pboxs .p-links .links2 a{ padding: 10px; font-size: 1.6em; color: #333;}
.product .pb-boxs .pboxs .p-links a:hover,.product .pb-boxs .pboxs .p-links a.lock{ color: #ac8d6b;}
.product .pb-boxs .pboxs .p-links a:hover:after,.product .pb-boxs .pboxs .p-links a.lock:after{  transform: scaleX(1); }
.product .pb-boxs .dots{ overflow: hidden; max-width: 1540px; margin: 0 auto;}
.product .pb-boxs .dots .dot{ float: left; /* 浮动布局，使元素向左浮动 */
  width: calc(25% - 100px); /* 计算宽度，占据父容器宽度的 25% 并减去 100px */
  height: 282px;
  margin: 50px 50px 30px 50px; /* 外边距：上 50px，右 50px，下 30px，左 50px */
  box-sizing: border-box; /* 确保 padding 和 border 包含在宽度内 */
  overflow: hidden; /* 隐藏超出部分 */
  position: relative; /* 相对定位，方便内部元素布局 */
  display: flex; /* 使用 Flexbox 布局 */
  flex-direction: column; /* 垂直排列 */
  align-items: center; /* 内容水平居中 */
  justify-content: center; /* 内容垂直居中 */}
.product .pb-boxs .dots .dot .img{width: 100%; /* 图片容器宽度占满父容器 */
  height: auto; /* 高度自适应 */
  display: flex; /* 使用 Flexbox 布局 */
  align-items: center; /* 图片垂直居中 */
  justify-content: center; /* 图片水平居中 */}
.product .pb-boxs .dots .dot .img img{ max-width: 100%; /* 图片最大宽度为容器宽度 */
  max-height: 100%; /* 图片最大高度为容器高度 */
  width: auto; /* 宽度自适应 */
  height: 282px; /* 高度自适应 */
  object-fit: contain; /* 等比缩放，完整显示图片 */ transform: scale(0.9);}
.product .pb-boxs .dots .dot .txt{ padding: 10px 5%;}
.product .pb-boxs .dots .dot .txt h3{ font-size: 1.6em; color: #6a6a6a; line-height: 24px; height: 24px; display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:1;}
.product .pb-boxs .dots .dot .txt p{ font-size: 1.4em;  color: #6a6a6a; line-height: 24px;  height: 48px; display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:2;}
.product .pb-boxs .dots .dot:hover .img  img{ transform: scale(1);} 

/*factory*/
.factory .fa-ban{ background: url(../images/factory/factory-ban.jpg) center center no-repeat; background-size: cover !important; height: 532px;}
.factory .bb>*{ float:none; width: 100%;}
.factory .bb{ padding: 100px 0; overflow: hidden; margin-bottom: 0;}
.factory .bb .tit{ padding-bottom: 100px;}
.factory .bb .imgs{ float:left; width: 40%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.factory .bb .imgs img{ max-width: 100%;}
.factory .bb .imgs p{ font-size: 1.4em; color: #000; line-height: 1.2; padding: 30px 0 60px 0;}
.factory .bb .txts{ width: 60%; padding: 0; float:left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.factory .bb .txts .txt{ max-height: 600px; max-width: 100%;}
.factory .bb .txts .txt .d{ border-bottom: 1px dashed #000;}
.factory .bb .txts .txt .d:last-child{ border-bottom: none;}

.b-list{ overflow: hidden; }
.b-list li{ float:left; border-left: 1px solid #999; padding: 0 20px;}
.b-list li:first-child{ padding-left: 0; border:none;}
.b-list li a.on{ color: #333333;}

/*shop*/
.shop { padding: 120px 0; overflow: hidden; }
.shop .tit{ overflow: hidden;}
.shop .tit .tits{ float:left;}
.shop .tit .s-sreach{ float:right; padding-top: 60px;}
.shop .tit .s-sreach input{ background: transparent; font-size: 1.4em; outline:none; border: none;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  line-height:24px;  padding: 5px 20px;}
.shop .tit .s-sreach .fc-input{ font-size: 1.4em; border: 1px solid #ac8d6b; color:#000;}
.shop .tit .s-sreach .fc-btn{ background:url(../images/sreach.png) center center no-repeat; background-size: 60%;}
.shop .tit .s-sreach::-webkit-input-placeholder { color:#a3a3a3;}
.shop .tit .s-sreach:-moz-placeholder { color:#a3a3a3;}
.shop .tit .s-sreach::-moz-placeholder { color:#a3a3a3;}
.shop .tit .s-sreach:-ms-input-placeholder { color:#a3a3a3;}


.shop #container-shop{ float:left; width: 70%; height: 720px;}
.shop .store_name_sx{ width: 300px;}
.shop .store_name_sx h3{ font-size: 1.6em; font-weight: bold; margin-bottom: 6px; border-bottom: 1px solid #ccc; padding-bottom: 12px;}
.shop .store_name_sx div p{ display: block; font-size: 1.4em; color: #333; line-height: 28px; }
.shop .maps{ margin-top: 80px; position: relative; width: 100%;}
.shop .maps .demo{ float:left; background: #fff; width: 30%; padding: 40px 40px 5% 6%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.shop .csssprite{ height: 42px;}
.shop .maps .demo h2{ font-size: 2.4em; color: #000; line-height: 36px; margin:0px  0 20px 0; }
.shop .maps .demo .dot{ border-bottom:1px solid #ddd; padding: 20px 0 30px 0;  margin: 0 16px 0 0;}
.shop .maps .demo h3{ font-size: 1.6em; color: #000; line-height: 36px; font-weight: bold;}
.shop .maps .demo p{ font-size: 1.4em; color: #a3a3a3; line-height: 24px; font-weight: 100;}
.shop .maps .scrollbar-inner{ overflow-y: scroll; height: 500px;}
#style-4::-webkit-scrollbar-track {	background-color:#F5F5F5;}
#style-4::-webkit-scrollbar { width:4px; background-color:#F5F5F5;}
#style-4::-webkit-scrollbar-thumb {	background-color:#b6bbbf;	 border-radius: 4px;}
.shop .maps .dot:hover h3{ color: #ac8d6b; font-weight: bold;}

/*service*/
.service .s1-ban{ background: url(../images/service/s1-ban.jpg) center center no-repeat; background-size: cover !important; height: 532px;}
.service .s2-ban{ background: url(../images/service/s2-ban.jpg) center center no-repeat; background-size: cover !important; height: 532px;}
.service .s3-ban{ background: url(../images/service/s3-ban.jpg) center center no-repeat; background-size: cover !important; height: 532px;}
.s1 .s1,.s2 .s2,.s3 .s3{ color: #000;}
.service .bb .txts .txt .d{ border-bottom: none;}
.service .bb .txts .txt{ max-height: 420px;}

/*contact*/
/*map*/
.content-window-card { position: relative; box-shadow: none; bottom: 0; left: 0; width: auto; padding: 0;}
.content-window-card p { height: 2rem;}
.custom-info {border: solid 1px silver;}
div.info-top { position: relative; background: none repeat scroll 0 0 #F9F9F9; border-bottom: 1px solid #CCC; border-radius: 5px 5px 0 0;}
div.info-top div { display: inline-block; color: #333333; font-size: 14px; font-weight: bold; line-height: 31px; padding: 0 30px 0 10px;}
div.info-top img { position: absolute; top: 10px; right: 10px; transition-duration: 0.25s;}
div.info-top img:hover { box-shadow: 0px 0px 5px #000;}
div.info-middle { font-size: 12px; padding: 10px 6px; line-height: 20px;}
div.info-bottom {height: 0px; width: 100%; clear: both; text-align: center;}
div.info-bottom img { position: relative;  z-index: 104;}
#map span { margin-left: 5px; font-size: 11px;}
.info-middle img { float: left; margin-right: 6px;}
#container{ height:1000px;}

.contact{ display: table; width: 100%; margin-bottom: 50px;  border-bottom:2px solid #000; } 
.contact>*{ display: table-cell; vertical-align: middle; width: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.contact .txts{ padding:120px 5%;}
.contact .txts .txt{ overflow: hidden;}
.contact .txts .txt .d{ float:left; width: 100%; padding-right: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.contact .txts .txt h3{ display: inline-block; font-size: 2.2em;  line-height: 1.2; padding-bottom: 10px; border-bottom: 2px solid #eee; color: #333;}
.contact .txts .txt p{ font-size: 1.4em; color: #666; line-height: 2;}
.contact .txts .txt h4{ font-size: 1.8em; color: #ac8d6b; line-height: 1.5; font-weight: bold; margin: 30px 0 6px 0; }
.contact .txts .cs{  margin-top: 60px;}
.contact .txts .cs>h3{font-size: 2.2em; line-height: 1.2; padding-bottom: 10px; color: #333;}
.contact .txts .cs .cds img{ padding: 5px 0 5px 5px;  width: 80px;}
.contact .txts .cs>img{ margin: 20px 0 25px 0;}
.contact .txts .cs .csd{ overflow: hidden; }
.contact .txts .cs .dot{ border-radius: 5px; overflow: hidden; position: relative; float:left; width: calc(33.33% - 10px); margin: 5px; }

.contact .txts .cs .dot .d1,.contact .txts .cs .dot .d2{transition:ease-out 0.5s;-moz-transition: ease-out 0.5s; -webkit-transition:ease-out 0.5s; -o-transition: ease-out 0.5s;}
.contact .txts .cs .dot>*{border-radius: 5px; height: 180px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.contact .txts .cs .dot .d1{ padding: 20px; text-align: center; background: #efefef;}
.contact .txts .cs .dot .d1 img{ padding: 20px;}
.contact .txts .cs .dot .d1 h3{ font-size: 1.6em; line-height: 1.5; color: #000;}
.contact .txts .cs .dot .d2{ opacity: 0;  transform:rotateY(180deg); text-align: center; padding: 30px; top:0; left: 0;  width: 100%; position: absolute; background: #222; }
.contact .txts .cs .dot .d2 img{ display: block; margin: 5px auto;}
.contact .txts .cs .dot .d2 img:last-child{ width: 80px;}
.contact .txts .cs .dot .d2 img:first-child{ width: 40px;}
.contact .txts .cs .dot .d2 p{ font-size: 1.6em; line-height: 1.5; color: #fff; word-break: break-all;}

.contact .txts .cs .dot:hover .d1{ transform:rotateY(180deg);}
.contact .txts .cs .dot:hover .d2{ opacity: 1; transform:rotateY(0deg); }





















