@charset "UTF-8";
@import url("reset.min.css");
@import url("animation.css");
@import url("hover.css");
body { color: #101010; font-size: 12px; font-family: "Microsoft Yahei", Arial, "Helvetica Neue", Helvetica, sans-serif; overflow-x: hidden;background: url(../images/bj.jpg) no-repeat center;background-size: cover; }

a { color: #101010; text-decoration: none; 
transition:all 0.5s ease-out 0s;
-webkit-transition:all 0.5s ease-out 0s;
-moz-transition:all 0.5s ease-out 0s;
-ms-transition:all 0.5s ease-out 0s;
-o-transition:all 0.5s ease-out 0s;}
a:hover { color: #021B35; text-decoration: none; }

*:focus { outline: none; }

.m-transition{
transition:all 0.5s ease-out 0s;
-webkit-transition:all 0.5s ease-out 0s;
-moz-transition:all 0.5s ease-out 0s;
-ms-transition:all 0.5s ease-out 0s;
-o-transition:all 0.5s ease-out 0s;}


.section{overflow: hidden; position:relative;}

.container { width: 1200px; margin: 0 auto; }
.container01{ width: 1240px; margin: 0 auto; }
.container02{ width: 1310px; margin: 0 auto; }

.sbs { position: relative; }

.pull-left{ float:left;}
.pull-right{ float:right;}



.g-box{ width:50%; height:100%; position:relative; float:left; overflow:hidden;}	

.page04{ background:url(../images/join-bj.jpg) center center no-repeat; background-size:cover;}

.g-page{ width:100%; height:100%; position:relative; z-index:9999;}

  

.section{overflow: hidden; }    
.section1{} 
.section2{ background: url(../images/bj02.jpg) center center no-repeat; background-size: cover;}
.section3{ background: url(../images/bj.jpg) center center no-repeat; background-size: cover;}
.section4{ background: url(../images/bj.jpg) center center no-repeat; background-size: cover;}
.section5{ background: url(../images/bj05.jpg) center center no-repeat; background-size: cover;}
.section6{ background: url(../images/bj06.jpg) center center no-repeat; background-size: cover;}  
.section7{ background: url(../images/bj07.jpg) center center no-repeat; background-size: cover;}
.section8{ background: url(../images/bj08.jpg) center center no-repeat; background-size: cover;}


.f-index-logo{ position:absolute; top:50px; right:35px; z-index:999;}
.f-index-logo img{ width:100%;}




/* 第一屏  home */
/*menu 开始*/
.g-nav {position:fixed;left: 0;top: 0;height: 100%;z-index: 10;perspective: 2000px;perspective-origin: right center;transform: translateX(-238px);transition: 0.8s cubic-bezier(0.19, 1, 0.22, 1); width:355px;}
.g-nav.on {transform: translateX(0);transition: 0.8s cubic-bezier(0.19, 1, 0.22, 1);}.g-nav .toggle {display: block;position: absolute;right:0px;padding: 30px 0;animation: sink-down 1s ease-out 2.5s both;}

.g-nav .f-open{ width:118px; height:72px; position:relative; left:0; cursor:pointer;}
.g-nav .f-close{ width:118px; height:72px; position:absolute; left:0; top:30px; opacity:0; z-index:999; cursor:pointer;}




.g-nav.on .f-open{ opacity:0;}
.g-nav.on .f-close{ opacity:1; left:-95px;}



.g-nav.on .toggle{ right:-100px;}
.g-nav.on .toggle .icon {transform: rotate(135deg);transition: 1s cubic-bezier(1, 0, 0, 1);}
.g-nav.on .toggle .hamburger1,  .g-nav.on .toggle .hamburger3 {opacity: 0;transition: 0.5s cubic-bezier(0.95, 0.05, 0.795, 0.035);}
.g-nav.on .toggle .hamburger1 {transform: translateY(18px);}
.g-nav.on .toggle .hamburger3 {transform: translateY(18px);}
.g-nav.on .toggle .slash {transform: translateY(18px) rotate(90deg) scaleX(1);transition: 0.5s 0.5s cubic-bezier(0.19, 1, 0.22, 1);}
.g-nav .f-panel {padding-top: 10px;height: 100%;text-align: center;box-sizing: border-box;width: 297px; left:60px;background:url(../images/nav-bj.png) right center no-repeat; background-size:cover;}
.g-nav.on .f-panel {opacity: 1;transform: rotateY(0) translateZ(0px);transform-origin: 0px 0px 0px;transition: 0.8s cubic-bezier(0.19, 1, 0.22, 1);}
#nav {font-size: 16px;line-height: 50px;margin: 17px 0;transform: translateX(-100px);opacity: 0;transition: 0.5s;}



.f-nav{ margin:0; padding:65px 0 0;transform: translateX(-100px);transition: 0.5s;}
.g-nav.on .f-nav {transform: translateX(0px);opacity: 1; transition: 0.5s;}
.f-nav li { width:170px; height: 40px;position: relative; margin-left:45px; margin-bottom:20px;}
.f-nav a {display: block;width: 100%;height: 100%; color:#333333;}
.m-nav-title{ width:170px; height:40px; line-height:40px; text-align:center; font-size:16px; color:#d2c291; position:relative; z-index:999; }
.m-nav-off{ width:170px; height:40px; position:absolute; top:0; left:0;}
.m-nav-on{ width:170px; height:40px; position:absolute; top:0; left:0; opacity:0;}


.f-nav li:hover .m-nav-title{ color:#4e1933;}
.f-nav li:hover .m-nav-off{ opacity:0;}
.f-nav li:hover .m-nav-on{ opacity:1;}




	
#nav a:hover{ color:#008a39;}			
#nav a:hover .ch {transform: translateX(-100%);transition: 0.5s;}
#nav a:hover .en {opacity: 1;transition: 0.5s;transform: translate(10px, 2px);}
.g-nav.on #nav .en {animation-play-state: running;}
.g-nav h1{ width:70%; height:auto; overflow:hidden; margin-bottom: 10px;transform: translateX(-100px);opacity: 0;transition: 0.5s; margin:0 auto; text-align:center;}
.g-nav h1 img{ width:100%;}
.g-nav.on h1 {transform: translateX(0px);opacity: 1;transition: 0.5s;}




/*menu 结束*/





/*banner*/
.g-banner{ width:100%; position:relative; overflow:hidden;}	
.g-banner .bd{ margin:0 auto; position:relative; z-index:0;  height: 100%;}
.g-banner .bd ul{ width:100% !important;  height: 100%;}
.g-banner .bd li{ width:100% !important;  height: 100%; overflow:hidden; text-align:center;  }
.g-banner .bd li a{ display:block; height:100%; }
.g-banner .hd{ width:100%;  position:absolute; z-index:1; bottom:18px; left:0; height:30px; line-height:30px; text-align:center; _background:#000; _filter:alpha(opacity=60); 	}
.g-banner .hd ul{ text-align:center;  padding-top:5px;  }
.g-banner .hd ul li{ cursor:pointer; display:inline-block; *display:inline; zoom:1; width:40px; height:12px; margin:5px; background:none; overflow:hidden; line-height:999999px; border:2px solid #fff;}
.g-banner .hd ul .on{ background:#fff;}



/*关于我们*/
.g-about{ width:965px; height:470px; position:absolute; left:0; top:20%; z-index:999; background:url(../images/about-bj.jpg) center center no-repeat; background-size:cover;}


/*关于我们分类*/
.f-item{ width:180px; height:260px; position:relative; margin:80px 0 0 170px; float:left;}
.f-item ul{ margin:0; padding:0;}
.f-item ul li{ width:38px; height:123px; background:url(../images/title-off.png) center center no-repeat; position:absolute;}
.f-item ul li a{ font-size:14px; color:#d4c493; line-height:20px; display:block;}

.m-item-title{ padding:20px 10px 0; position:relative; z-index:999; font-size:14px; color:#d4c493; text-align:center; margin-bottom:0;}
.m-i02 .m-item-title{ padding-top:10px;}
.m-item-on{ opacity:0; position:absolute; top:0; left:0; margin-bottom:0;}

.f-item ul li:hover .m-item-title{ color:#8d0009;}
.f-item ul li:hover .m-item-on{ opacity:1;}


.m-i01{ top:0; left:35px;}
.m-i02{ top:0; left:107px;}
.m-i03{ top:138px; left:0;}
.m-i04{ top:138px; left:71px;}
.m-i05{ top:138px; left:142px;}





/*关于富桥*/
.f-about{ width:500px; height:360px; float:right; position:relative; margin:55px 55px 0 0;}

.f-about-desc{ width:280px; height:360px; position:relative; float:left; overflow:hidden;}
.f-about-desc a{ font-size:16px; color:#333333; line-height:35px;
writing-mode: vertical-rl;/*从左向右 从右向左是 writing-mode: vertical-rl;*/  
writing-mode: tb-rl;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*/  }
.f-about-desc a:hover{ color:#8d0009;}

.f-about-title{ width:200px; height:350px; position:relative; float:right;}
.f-about-bt{ width:200px; height:350px; position:relative;}
.f-about-bt img{ width:100%;}

.f-more{ width:131px; height:40px; line-height:40px; text-align:center; position:absolute; left:40px; bottom:0; background:url(../images/more-off.png) center center;}
.f-more a{ font-size:14px; color:#d4c493; position:relative; z-index:99; display:block;}

.f-more-zzc{ width:131px; height:40px; position:absolute; top:0; left:0; opacity:0;}

.f-more:hover a{ color:#8d0009;}
.f-more:hover .f-more-zzc{ opacity:1;}










/*团队展示*/
.f-team{ width:1495px; height:710px; overflow:hidden; position:absolute; top:10%; right:0;}
.f-team .hd{height:20px; padding-right:30%; margin-top:20px;}
.f-team .hd ul{ margin:0; padding:0; float:right;}
.f-team .hd ul li{ float:left; width:17px; height:17px; overflow:hidden; margin:0 5px; text-indent:-999px; cursor:pointer; background:#fff;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
-ms-border-radius:50%;
-o-border-radius:50%;}
.f-team .hd ul li.on{ background:#8d0009; }


.f-team .bd{ width:1495px; height:665px; position:relative;}
.f-team .bd ul{ width:100%; height:100%; margin:0; padding:0;}
.f-team .bd ul li{ width:100%; height:100%; position:relative; overflow:hidden; float:left;}
.f-team .bd ul li a{ width:100%; height:100%; display:block;}








/*主营项目*/
.g-service{ width:100%; height:100%; position:relative;}
.g-service ul{ margin:0; padding:0;}
.g-service ul li{ width:50%; height:50%; float:left; position:relative;}

.g-service ul li:nth-child(1) img{ width:100%;}


.g-service ul li:nth-child(2) .f-service-img{ float:right !important;}


.f-service-img{ width:50%; height:100%; position:relative; overflow:hidden; float:left;}

.f-service-box{ width:50%; height:100%; position:relative; overflow:hidden; float:left; background:url(../images/service-off.jpg) center center no-repeat; background-size:cover;}
.f-service-title{ width:167px; height:369px; position:absolute; left:50%; top:50px; margin:0 0 0 -83px;}
.f-service-title img{ width:100%;}


.f-service-on{ width:100%; height:100%; position:absolute; top:0; left:0; background:url(../images/service-on.jpg) center center no-repeat; background-size:cover; opacity:0;
transition:all 1s ease-out 0s;
-webkit-transition:all 1s ease-out 0s;
-moz-transition:all 1s ease-out 0s;
-ms-transition:all 1s ease-out 0s;
-o-transition:all 1s ease-out 0s;}
.f-service-bt{ width:167px; height:369px; position:absolute; left:50%; top:75px; margin:0 0 0 -83px; opacity:0;}


.g-service ul li:hover .f-service-on{ opacity:1;}
.g-service ul li:hover .f-service-bt{ top:50px; opacity:1;
transition-delay:0.5s;
-webkit-transition-delay:0.5s;
-moz-transition-delay:0.5s;
-ms-transition-delay:0.5s;
-o-transition-delay:0.5s;}




/*找商加盟*/
.f-join{ width:65%; margin:0 auto; position:relative; top:10%;}
.f-join-title{ width:100%; height:299px; text-align:center; position:relative; margin-bottom:90px;}

.f-join-bt{ width:100%; height:45px; line-height:45px; text-align:center; font-size:30px; color:#d4c493; margin-bottom:30px;}
.f-join-desc{ width:100%; height:180px; line-height:30px; font-size:16px; color:#d4c493; position:relative; overflow:hidden; margin-bottom:65px;}
.f-join-desc a{ font-size:16px; color:#d4c493;}
.f-join-desc a:hover{ color:#8d0009;}

.f-join-more{ width:155px; height:40px; margin:0 auto; position:relative;}
.f-join-more a{ width:155px; height:40px; line-height:37px; text-align:center; font-size:16px; color:#d4c493; border:1px solid #d4c493; display:block;}
.f-join-more a:hover{ color:#d4c493; background:#8d0009; border-color:#8d0009;}





/*门店展示*/
.g-shop{ width:1620px; height:740px; position:absolute; left:0; top:50%; margin-top:-330px;}

.g-shop .parHd{ width:1042px; height:40px; line-height:40px; position:relative; float:right;}
.g-shop .parHd ul{ margin:0; padding:0;}
.g-shop .parHd ul li{ width:131px; height:40px; line-height:40px; font-size:16px; color:#d4c493; text-align:center; float:left; cursor:pointer; margin-right:55px; background:url(../images/more-off.png) center center no-repeat;  }
.g-shop .parHd ul li.on{ background:url(../images/more-on.png) center center no-repeat; color:#8d0009;}



.g-shop .parBd{ width:1620px; height:665px; margin:30px 0 0; padding:0; float:right; position:relative; z-index:99;}
.g-shop .slideBox{ overflow:hidden; zoom:1; }
.g-shop .sPrev{ width:97px; height:34px; position:absolute; right:185px; bottom:0; background:url(../images/prev.png) center center no-repeat; border:1px solid #d4c493;}
.g-shop .sPrev:hover{ background:#8d0009 url(../images/prev.png) center center no-repeat; border-color:#8d0009;}
.g-shop .sNext{ width:97px; height:34px; position:absolute; right:75px; bottom:0; background:url(../images/next.png) center center no-repeat; border:1px solid #d4c493;}
.g-shop .sNext:hover{ background:#8d0009 url(../images/next.png) center center no-repeat; border-color:#8d0009;}


.g-shop .parBd .tempWrap{ float:left;  }
.g-shop .parBd ul{ overflow:hidden; zoom:1; float:left;  }
.g-shop .parBd ul li{ width:1310px; height:665px; float:left; _display:inline; overflow:hidden; position:relative; }
.m-shop-img{ width:1310px; height:665px; position:relative; overflow:hidden;}

.g-shop .parBd ul li img{ width:100%;}

.f-shop-title{ position:absolute; top:0; right:0;}




/*新闻*/
.g-news{ width:63.5%; height:100%; position:relative;}

.f-news{ width:840px; height:775px; margin:0 auto; position:relative; top:10%;}

.f-news-bt{ width:840px; height:299px; text-align:center; position:relative; margin-bottom:85px;}


.f-news{ width:840px;  overflow:hidden; position:relative;}
.f-news .hd{ width:840px; height:20px; position:relative;}
.f-news .hd ul{ width:840px; height:20px; position:relative; text-align:center;}
.f-news .hd ul li{ width:16px; height:16px; line-height:100px; margin:0 7px; display:inline-block; background:#8d0009; cursor:pointer;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
-ms-border-radius:50%;
-o-border-radius:50%;}
.f-news .hd ul li.on{ background:#d4c493;}
		
		
.f-news .bd{ width:840px; height:320px; position:relative; margin:0 0 50px; overflow:hidden;}
.f-news .bd ul{ margin:0; padding:0;}
.f-news .bd ul li{ width:385px; height:320px; position:relative; float:left; margin-right:60px; background:url(../images/news-bj.png) center center no-repeat;}

.f-news-box{ width:385px; height:auto; position:absolute; top:30px; left:0; padding:0 30px; z-index:999;}

.f-news-item{ width:131px; height:40px; line-height:40px; text-align:center; font-size:16px; color:#d4c493; margin-bottom:15px; background:url(../images/more-off.png) center center no-repeat;}
.f-news-title{ width:325px; height:25px; line-height:25px; font-size:18px; color:#d4c493; overflow:hidden; margin-bottom:20px;}
.f-news-desc{ width:325px; height:90px; line-height:30px; font-size:14px; color:#d4c493; overflow:hidden; margin-bottom:40px;}
.f-news-date{ width:325px; height:20px; line-height:20px; font-size:14px; color:#a48e6a; overflow:hidden; margin-bottom:0;}


.f-news-img{ width:385px; height:320px; position:absolute; top:0; left:0; opacity:0;}
.m-news-img{ width:385px; height:320px; position:relative; overflow:hidden;}  


 

.f-news .bd ul li:hover .f-news-box{ top:129px; padding-top:13px; background:rgba(0,0,0,0.6);}
.f-news .bd ul li:hover .f-news-title{ color:#fff;}
.f-news .bd ul li:hover .f-news-desc{ height:60px; color:#fff;}

.f-news .bd ul li:hover .f-news-img{ opacity:1;}








/*联系我们标题*/
.f-contact-title{ width:378px; height:299px; position:absolute; top:10%; left:12%;}


.f-contact{ width:640px; height:640px; position:absolute; top:50%; left:50%; margin:-320px 0 0 -320px; border:1px solid #d4c493;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
-ms-border-radius:50%;
-o-border-radius:50%;}



.f-contact-box{ width:568px; height:568px; margin:36px auto; position:relative; background:url(../images/contact-bj.png) center center no-repeat; padding-top:170px;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
-ms-border-radius:50%;
-o-border-radius:50%;}



.f-lxfs{ width:390px; height:auto; position:relative; margin:0 auto;}
.f-lxfs ul{ margin:0; padding:0;}
.f-lxfs ul li{ width:390px; min-height:30px; line-height:30px; font-size:16px; color:#222222; margin-bottom:10px;}



/*二维码*/
.f-code{ width:155px; margin:50px auto 0; position:relative;}
.f-code .hd{ width:30px; height:auto; position:relative; float:left; padding-top:25px;}
.f-code .hd ul{ margin:0; padding:0;}
.f-code .hd ul li{ width:30px; height:30px; position:relative; margin-bottom:5px; cursor:pointer;
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
-ms-border-radius:50%;
-o-border-radius:50%;}

.m-code-icon01{ background:#d4c493 url(../images/code-icon01-off.png)}
.m-code-icon02{ background:#d4c493 url(../images/code-icon02-off.png)}

.m-code-icon01.on{ background:#8d0009 url(../images/code-icon01-on.png)}
.m-code-icon02.on{ background:#8d0009 url(../images/code-icon02-on.png)}




.f-code .bd ul{ width:110px; height:135px; float:right; margin:0; padding:0;}

.m-code-img{ width:110px; height:110px; position:relative; overflow:hidden;}
.m-code-img img{ width:110px; height:110px;}
.m-code-title{ width:110px; height:25px; line-height:25px; text-align:center; font-size:14px; color:#222222;}





.f-map{ width:106px; height:106px; position:absolute; top:499px; left:13px;}
.f-message{ width:106px; height:106px; position:absolute; top:56px; left:531px;}








/*icp*/
.g-icp{ width:100%; height:50px; position:absolute; left:0; bottom:0; z-index:9999999; background:#6b0d0b;}
.f-icp{ width:1200px; height:50px; line-height:50px; text-align:center; margin:0 auto;}
.f-icp span{ font-family:微软雅黑; font-size:14px; color:#d4c493; height:40px; line-height:40px; margin:0 2px;}
.f-icp span img{ position:absolute;}
.f-icp a{ font-family:微软雅黑; font-size:14px; color:#d4c493;}
.f-icp a:hover{ color:#fff;}