@charset "utf-8";
/* 
 * Project Name:圣迪乐村
 * Author:位置
 * Date：2016-10-27
 */

@font-face { font-family: 'exotic_350_demi-bold'; src: url('exotic350bt-demibold-webfont.woff2') format('woff2'), url('exotic350bt-demibold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0px; border: 0; font-size: 100%; outline: none; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-x: hidden; }
/* always display scrollbars */
body { font: 12px/1.8 "Microsoft YaHei New","Microsoft Yahei","微软雅黑","Hiragino Sans GB","冬青黑体","Arial","Helvetica","SimHei","黑体","STXihei","华文细黑",sans-serif; margin: 0 auto; color: #989898; background-color: #e4e4e4; _background-attachment: fixed; _background-image: url(about:blank); overflow-x: hidden; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
input, select { vertical-align: middle; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
strong { font-weight: bold; }
input { outline: none; padding: 0; }
img { border: 0; }
input[type="text"], input[type="button"], input[type="submit"], input[type="reset"], select { -webkit-appearance: none; border-radius: 0; }
textarea { -webkit-appearance: none; border-radius: 0; background: none; outline: none; padding: 0; margin: 0; border: none; }
::-moz-selection { background: #f7a300; color: #fff; text-shadow: none; }
::selection { background: #f7a300; color: #fff; text-shadow: none; }
a { text-decoration: none; blr: expression(this.onFocus=this.blur()); -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; }
a:link, a:visited { text-decoration: none; }
a:active, a:hover { text-decoration: none; }
.clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.fc { text-align: center; }
.fr { text-align: right; }
.l { float: left; display: inline-block; }
.r { float: right; display: inline-block; }
.vt { vertical-align: top; }
.vm { vertical-align: middle; }
.inner { width: 1000px; margin: 0px auto; }
.inner2 { width: 700px; margin: 0px auto; }
.homebody, .home { width: 100%; height: 100%; transition: 428ms ease-in-out; overflow: hidden;  }
.home { position: absolute; left: 0; top: 0; margin-left: 60px; margin-right: 60px; transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1); overflow-x: hidden; }
.home.on { left: 610px; }

.wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transition: -webkit-transform 1.5s; transition: transform 1.5s; -webkit-perspective: 3000; perspective: 3000; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; }
.wrapper .page { position: relative; width: 100%; height: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; transform: scale(0.4); -webkit-transform: scale(0.4); -moz-transform: scale(0.4); opacity: 0.5; transition: all 0.8s cubic-bezier(0.445, 0.145, 0.355, 1); -webkit-transition: transition: all 0.8s cubic-bezier(0.445, 0.145, 0.355, 1); }
.wrapper .page.page1 { }
.wrapper .page.page2 { background-color: #fcf5ed; }
.wrapper .page.page3 { background: url(../images/section3.jpg) center no-repeat; background-size: cover !important; }
.wrapper .page.page4 { background: url(../images/section4.jpg) center no-repeat; background-size: cover !important; }
.wrapper.active-page1 .page.page1 { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; }
.wrapper.active-page2 .page.page2 { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; }
.wrapper.active-page3 .page.page3 { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; }
.wrapper .page.page4 { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; }
.wrapper.active-page4 .page.page4 { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; }
.wrapper .footer-box { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; }
.wrapper.active-page5 .page.footer-box { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }

.mtop { display: none; }
/*banner*/

.bannerBox { position: absolute; width: 100%; height: 100%; right: 0; top: 102px; z-index: 20; }
.bannerBox .banner li { height: 100%; line-height: 0; }
.bannerBox .banner li img { line-height: 0; width: 100%; position: relative; transition: transform 5.5s ease 0s, opacity 2s ease 0s; -webkit-transition: transform 5.5s ease 0s,
 opacity 2s ease 0s; }
.bannerBox .banner li img.imghide { display: none; }
.bannerBox .banner li.imgIn img { opacity: 1; transform: matrix(1.1, 0, 0, 1.1, 0, 0); -webkit-transform: matrix(1.1, 0, 0, 1.1, 0, 0); }
.bannerBox .banner { z-index: 30; overflow: hidden; }
.bannerBox .flex-control-nav { position: absolute; left: 70px; bottom: 77px; height: 33px; z-index: 99; }
.bannerBox .flex-control-nav li { float: left; position: relative; margin-right: 5px; }
.bannerBox .flex-control-nav li a { display: block; position: relative; top: 17px; width: 6px; height: 16px; border-radius: 3px; background: #766047; transition: 300ms ease-in-out; }
.bannerBox .flex-control-nav li span { display: block; text-indent: 888px; overflow: hidden; position: absolute; left: 0; bottom: 0; width: 100%; height: 0%; background: #505050; border-radius: 3px; }
.bannerBox .flex-control-nav li a.flex-active { top: 0; height: 33px; transition: 500ms linear; }
.bannerBox .flex-control-nav li a.flex-active span { opacity: 1; height: 24px; transition: 3500ms linear; }
.daily { width: 79px; height: 41px; background: url(../images/font.png) center no-repeat; position: absolute; left: 150px; bottom: 77px; z-index: 50; }
.mouse { position: absolute; right: 60px; bottom: 67px; text-align: center; z-index: 50; }
.mouse span { display: inline-block; width: 24px; height: 36px; background: url(../images/scoll.png) center no-repeat; margin: auto; position: relative; }
.mouse span:before { content: ""; width: 4px; height: 7px; background: url(../images/dit.png) center no-repeat; position: absolute; left: 50%; margin-left: -2px; top: 8px; animation-delay: 0ms; animation-duration: 1500ms; animation-iteration-count: infinite; animation-name: arrow; animation-play-state: running; animation-timing-function: linear; }
.mouse b { display: block; text-align: center; color: #766047; font-size: 18px; line-height: 1; font-family: Arial; margin-top: 4px; font-weight: normal; }
.letter { position: absolute; left: 0; bottom: 26px; text-align: center; width: 100%; z-index: 50; box-sizing: border-box; overflow: hidden; }
.letter img { max-width: 100%; margin: auto; display: inline-block; }
.letter span { display: inline-block; margin: auto; text-align: center; color: #292420; font-family: Arial; line-height: 1; letter-spacing: 44px; text-transform: uppercase; display: none; }
.btext { position: absolute; width: 1000px; position: absolute; left: 50%; margin-left: -500px; top: 15%;}
.btext strong { display: block; text-align: center; color: #ed6022; font-size: 24px; font-weight: normal; line-height: 1; margin-bottom: 12px; }
.btext h1 { color: #ed6022; font-size: 34px; font-weight: normal; line-height: 1; text-align: center; }
.btext small { display: block; text-align: center; color: #956f5c; font-size: 16px; text-align: center; line-height: 1; margin-top: 7px; font-family: "Arial"; }
.btext1 h1, .btext1 small { text-align: left; }

.transy { transform: translate(120px,-50%); -webkit-transform: translate(120px,-50%); transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; transition: 900ms 0ms; -webkit-transition: 900ms 0ms; opacity: 0; }
.bannerBox li.flex-active-slide .btext.transy { transform: translate(0,-50%); -ms-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); opacity: 1; transition: 900ms 600ms; -webkit-transition: 900ms 600ms; }

.header-box { position: fixed; width: 100%; background: #505050; left: 0; top: 0; z-index: 999; padding: 32px 0 28px; transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1); }
.header-box.on { left: 610px; }
.header { padding-left: 60px; padding-right: 60px; }
.tel { float: left; margin-top: 15px; }
.tel span { display: inline-block; padding-left: 28px; color: #fff; font-size: 16px; line-height: 20px; font-family: "Arial"; background: url(../images/tel.png) left center no-repeat; }
.logo { width: 94px; height: 84px; position: absolute; line-height: 1; left: 5%; margin-left: 10px; top: 9px; z-index: 10; }
.logo img { display: block; width: 100%; height: auto; line-height: 1; }
.nav { position: absolute; left: 50%; top: 0; margin-left: -388px; transition: 320ms ease; }
.nav > li { position: relative; float: left; padding-right: 5px; padding-left: 5px; }
.nav > li > a { display: inline-block; width: 90px; padding-top: 50px; padding-bottom: 37px; line-height: 1; color: #fff; font-size: 15px; text-align: center; position: relative; }
.nav > li > a:before { content: ""; width: 100%; height: 5px; position: absolute; left: 0; top: -5px; background: url(../images/navbg.png) center no-repeat; background-size: cover; transition: 328ms ease-in; }
.nav > li:hover > a, .nav > li.creent > a { color: #fff; }
.nav > li:hover > a:before, .nav > li.creent > a:before { opacity: 1; top: 0; }
.nav > li:nth-child(3) { padding-right: 5px;
    padding-left: 5px; }
.nav > li:nth-child(4) { padding-right: 5px;
    padding-left: 5px;}
.leval { width: 158px; padding-top: 6px; position: absolute; left: -27px; top: 101px; transition: 248ms ease-in-out; opacity: 0; top: 118px; visibility: hidden; filter: alpha(opacity=0); }
.leval.show { opacity: 1; top: 101px; visibility: visible; transition: 348ms ease-in-out; filter: alpha(opacity=100); }
.leval-nav { padding: 14px 0; background: #505050; border-radius: 18px; }
.leval-nav li { margin-bottom: 4px; position: relative; }
.leval-nav li:before { content: ""; width: 0; height: 100%; background: #505050; position: absolute; left: 50%; top: 0; transition: 344ms ease-in-out; visibility: hidden; }
.leval-nav li a { display: block; text-align: center; position: relative; line-height: 33px; color: #ffffff; font-size: 14px; }
.leval-nav li:hover:before { width: 100%; left: 0; visibility: visible; }

.menuBtn { float: left; position: relative; width: 70px; height: 62px; cursor: pointer; z-index: 99; display: none; background: #505050; border-radius: 7px; }
.menuBtn .burger { display: block; width: 32px; height: 4px; border-radius: 2px; position: absolute; left: 20px; background: #fff; transform-origin: center; -webkit-transform-origin: center; -moz-transform-origin: center; -o-transform-origin: center; -ms-transform-origin: center; transition: transform 277ms ease-in-out; -o-transition: transform 277ms ease-in-out; -ms-transition: transform 277ms ease-in-out; -moz-transition: transform 277ms ease-in-out; }
.menuBtn .burger-1 { top: 16px; }
.menuBtn .burger-2 { top: 28px; }
.menuBtn .burger-3 { top: 40px; }
.menuBtn.active .burger-1 { top: 8px; -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
.menuBtn.active .burger-3 { top: 8px; -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.menubox { position: fixed; width: 610px; overflow-y: auto; height: 100%; left: 0; margin-left: -610px; top: 0; background: #505050; z-index: 999; transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1); display: none; }
.menubox.on { margin-left: 0; }
.menuhome { background: #505050; }
.menuhome a { display: block; line-height: 90px; line-height: 90px; color: #fff; text-indent: 60px; font-size: 24px; font-weight: normal; }
.menu-list { padding: 20px 0; }
.menu-list > li > a { color: #ffffff; display: block; line-height: 90px; height: 90px; background: #505050; font-size: 24px; text-indent: 60px; }
.menu-list > li > a.on { background: #f2af09; }
.leval-menu { background: #ffffff; display: none; }
.leval-menu li { border-bottom: 1px solid #e2e2e2; }
.leval-menu li a { line-height: 80px; color: #292420; font-size: 24px; text-indent: 60px; display: block; }
.leval-menu li:last-child { border-bottom: none; }

.market { float: right; margin-right: 15px; }
.market-info { float: left; margin-left: 24px;line-height: 60px; }
.market-info a { display: block; width: 58px; height: 42px; transition: 266ms ease-in-out; }
.market-info1 a { background: url(../images/icon.png) 0 0 no-repeat; }
.market-info2 a { background: url(../images/icon.png) 0 -92px no-repeat; }
.market-info1:hover a { background: url(../images/icon.png) 0 -46px no-repeat; }
.market-info2:hover a { background: url(../images/icon.png) 0 -138px no-repeat; }
.retuit{ float:left; width:123px; line-height:1; padding-top:8px;}
.retuit img{ width:100%; height:auto;}

.header-box.scollfox { padding: 11px 0 10px; border-bottom: 1px solid #e9e6e0; animation: 850ms 350ms; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: fadedown; animation-name: fadedown; }
.header-box.scollfox .logo { position: static; left: 0; height: auto; margin-left: 0; float: left; width: 94px; }
.header-box.scollfox .tel { display: none; }
.header-box.scollfox .nav { margin-left: -300px; }
.header-box.scollfox .nav > li:nth-child(3) { margin-right: 0; }
.header-box.scollfox .nav > li:nth-child(4) { margin-left: 0; }
.header-box.scollfox .nav > li > a { padding-top: 52px; padding-bottom: 28px; }
.header-box.scollfox .nav > li .leval { top: 98px; }
.header-box.scollfox .nav > li .leval.show { top: 73px; }

.pagewidth { top: 74px; position: absolute; left: 0; width: 100%; }
.pages { width: 1200px; margin: auto; }
.absorbed { padding-top: 13.8%; }
.wrapper.active-page2 .page.page2 .absorbed-t { opacity: 1; visibility: visible; top: 0; transition: 650ms 750ms; }
.wrapper.active-page2 .page.page2 .absorbed .eggs-info .eggstop { opacity: 1; visibility: visible; top: 0; transition: 680ms 1000ms; }
.wrapper.active-page2 .page.page2 .absorbed .eggs-info:nth-child(2) .eggstop { transition: 680ms 1300ms; }
.wrapper.active-page2 .page.page2 .absorbed .eggs-info:nth-child(3) .eggstop { transition: 680ms 1600ms; }
.absorbed-t { margin-bottom: 10px; opacity: 0; visibility: hidden; top: 85px; transition: 650ms 0ms; position: relative; }
.absorbed-t h2 { color: #505050; font-size: 36px; text-align: center; line-height: 1; margin-bottom: 10px; font-weight: normal; }
.absorbed-t small { display: block; text-align: center; line-height: 1; color: #505050; font-size: 14px; text-transform: uppercase; font-family: "Arial"; }
.absorbed-t p { color: #505050; font-size: 16px; padding: 0 50px; text-align: center; line-height: 1.4; margin-top: 12px; }
.eggs { margin-top: 104px; text-align: center; overflow: hidden; }
.absorbed .eggs-info .eggstop { opacity: 0; visibility: hidden; top: 56px; }
.eggs-info { position: relative; text-align: center; float: left; padding: 18px 0; }
.eggs-info .eggsimg { position: relative; padding: 0 20px; }
.eggstop { position: relative; z-index: 5; border-radius: 50%; }
.eggs-info .eggsimg .eggstop:before { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(../images/radius.png) center no-repeat; background-size: cover !important; transform: scale(0.8); -webkit-transform: scale(0.8); -moz-transform: scale(0.8); visibility: hidden; transition: 426ms 0ms ease-in-out; }
.eggs-info .eggsimg figure { display: block; line-height: 1; overflow: hidden; position: relative; border-radius: 50%; overflow: hidden; }
.eggs-info .eggsimg figure img { display: block; line-height: 1; width: 100%; height: auto; border-radius: 50%; overflow: hidden; }
.eggstext { width: 100%; position: absolute; left: 0; top: 50%; text-align: center; margin-top: -68px; }
.eggstext strong { display: block; width: 91px; height: 14px; line-height: 1; margin: auto; margin-bottom: 20px; text-align: center; }
.eggstext strong img { max-width: 100%; height: auto; margin: auto; line-height: 0; }
.eggs-info .eggstext strong.aa { background: url(../images/aa.png) center no-repeat; }
.eggs-info .eggstext strong.gu { background: url(../images/egge.png) center no-repeat; }
.eggs-info .eggstext strong.omg { background: url(../images/omg.png) center no-repeat; }
.eggstext span { display: block; text-align: center; color: #ffffff;
    text-shadow: #000 2px 2px 2px; font-size: 32px; line-height: 1; margin-bottom: 15px; }
.eggstext b { display: block; line-height: 1; text-align: center; color: #ffffff;
    text-shadow: #000 2px 2px 2px; font-size: 16px; font-weight: normal; }
.eggs-info .eggsimg .eggstop:hover:before { transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); visibility: visible; ransition: 426ms 150ms ease-in-out; }
.eggs-info .eggstop:hover { -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8); transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8); -webkit-animation: beat 0.5s 1; animation: beat 0.5s 1; }
.eggs-info:hover .more { opacity: 1; top: 0; filter: alpha(opacity=100); }
.more { width: 164px; height: 49px; margin: auto; margin-top: 22px; position: relative; border-radius: 26px; background: #505050; top: 30px; opacity: 0; transition: 380ms ease-in-out; filter: alpha(opacity=0); }
.more a, .more span { display: block; padding-left: 36px; text-align: left; line-height: 49px; color: #fff; font-size: 16px; background: url(../images/arrow.png) 121px center no-repeat; }


.wrapper.active-page3 .page.page3 .farm { opacity: 1; visibility: visible; top: 0; transition: 850ms 780ms; }
.farm { padding-top: 6%; text-align: center; position: relative; top: 120px; opacity: 0; visibility: hidden; transition: 650ms 0ms; }
.farm h3 { color: #505050; font-size: 36px; text-align: center; line-height: 1; font-weight: normal; margin-bottom: 10px; }
.farm small { display: block; text-align: center; color: #505050; font-size: 14px; line-height: normal; text-transform: uppercase; font-family: "Arial"; line-height: 1; }
.farm p { color: #505050; font-size: 16px; text-align: center; margin-top: 12px; line-height: 1.4; }
.farm li {float: left; width: 24%;margin-right: 1%; margin-top: 5px}
.farm li a{text-align: center; color: #505050; font-size: 14px;}

.commons .more { top: 0; margin-top: 56px; background: #fff; opacity: 1; visibility: visible; filter: alpha(opacity=100); }
.commons .more i { filter: alpha(opacity=0); width: 100%; height: 100%; border-radius: 26px; background: #505050; filter: alpha(opacity=0); position: absolute; left: 0; top: 0; transform-origin: left top; -webkit-transform-origin: left top; -webkit-transition: -webkit-transform .3s cubic-bezier(.4,0,.2,1); transition: -webkit-transform .3s cubic-bezier(.4,0,.2,1); transition: transform .3s cubic-bezier(.4,0,.2,1); transition: transform .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1); transform: scaleY(0); -webkit-transform: scaleY(0); }
.commons .more a { position: relative; background: url(../images/arrow1.png) 121px center no-repeat; color: #505050; }
.commons .more:hover i { transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transform-origin: left bottom; -webkit-transform-origin: left bottom; filter: alpha(opacity=100); }
.commons .more:hover a { color: #fff; background: url(../images/arrow.png) 121px center no-repeat; }
.recipes { padding-top: 10%; }
.recipes .absorbed-t h2, .recipes .absorbed-t small, .recipes .absorbed-t p { text-align: left; padding: 0; }
.recipes-text { margin-top: 40px; }
.recipes-text:hover figure img { transform: scale(1.06); -webkit-transform: scale(1.06); -moz-transform: scale(1.06); }
.recipes-text:hover .menu-wr h3 { color: #505050; }
.recipes-text figure { float: left; width: 283px; position: relative; overflow: hidden; border: 3px solid rgba(255,255,255,0.42); border-radius: 12px; transform-style: preserve-3d; -webkit-transform-origin: 0 0 0; -webkit--webkit-transform-origin: 0 0 0; transform: rotateY(90deg); -webkit-transform: rotateY(90deg); transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 600ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 0ms; -webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 0ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 0ms; opacity: 0; }
.wrapper.active-page4 .page.page4 .absorbed-t { opacity: 1; visibility: visible; top: 0; transition: 650ms 750ms; }
.wrapper.active-page4 .page.page4 .recipes-text figure, .wrapper.active-page4 .page.page4 .menu { opacity: 1; transform: rotateY(0); -webkit-transform: rotateY(0); -webkit-transform: rotateY(0); transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 600ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 600ms; -webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 600ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 600ms; }
.wrapper.active-page4 .page.page4 .menu { transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1000ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1000ms; -webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1000ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 1000ms; opacity: 1; }
.wrapper.active-page4 .page.page4 .recipes .commons .more { opacity: 1; visibility: visible; left: 0; transition: 860ms 600ms; }

.recipes-text figure img { display: block; border-radius: 12px; width: 100%; height: 200px; line-height: 0; transition: 550ms 0ms; }
.recipes-text figure strong { display: block; width: 86px; height: 86px; background: url(../images/radius1.png) center no-repeat; position: absolute; left: 8px; top: 7px; color: #7e6d5c; font-size: 14px; line-height: 86px; font-weight: normal; text-align: center; }
.recipes-text figure strong b { display: inline-block; font-weight: normal; font-size: 34px; margin-right: 5px; }
.menu { width: 380px; height: 200px; border-radius: 12px; border: 3px solid rgba(255,255,255,0.4); background: #fff; float: left; margin-left: 14px; transform-style: preserve-3d; -webkit-transform-origin: 0 0 0; -webkit--webkit-transform-origin: 0 0 0; transform: rotateY(90deg); -webkit-transform: rotateY(90deg); transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 0ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 0ms; -webkit-transition: opacity 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 0ms, transform 800ms cubic-bezier(0.55, 0.31, 0.15, 0.93) 0ms; opacity: 0; }
.menu-wr { padding: 44px 28px 0 28px; }
.menu-wr h3 { color: #505050; font-size: 24px; font-weight: normal; line-height: 1; padding-bottom: 22px; border-bottom: 2px solid #efefef; margin-bottom: 22px; transition: 300ms; }
.menu-wr p { color: #8b8b8b; font-size: 14px; line-height: 2; }
.recipes .commons .more { margin: 0; margin-top: 32px; opacity: 0; left: 140px; visibility: hidden; transition: 750ms 0ms; }
.eggs .slick-prev, .eggs .slick-next { display: none; padding: 0; margin: 0; outline: none; transition: 330ms ease-in-out; border: none; cursor: pointer; width: 58px; height: 58px; position: absolute; top: 40%; text-indent: 888px; overflow: hidden; }
.eggs .slick-prev { background: url(../images/prev.png) center no-repeat; left: 0; }
.eggs .slick-prev:hover { background: url(../images/prev1.png) center no-repeat; }
.eggs .slick-next { background: url(../images/next.png) center no-repeat; right: 0; }
.eggs .slick-next:hover { background: url(../images/next1.png) center no-repeat; }

.footer-box { padding-bottom: 72px; height: auto !important; }
.footer { padding: 48px 16px 48px 44px; position: relative; border-top: 10px solid #8b8b8b; background: #505050; height: auto !important; }
.footer-left { float: left; }
.investment { margin-bottom: 24px; }
.investment a { display: inline-block; float: left; margin-right: 44px; color: #fff; font-size: 20px; line-height: 1; }
.edite { color: #c5c5c5; font-size: 14px; line-height: 1; position: absolute; left: 44px; top: 94px; }
.edite a { display: inline-block; color: #c5c5c5; margin-left: 16px; }
.edite a:hover { color: #c5c5c5; }
.footer-right { float: right; }
.footer-right p { margin-bottom: 16px; }
.footer-right p span { display: inline-block; margin-left: 26px; color: #c5c5c5; font-size: 14px; line-height: 1; }
.footer-right p span b { display: inline-block; font-weight: normal; margin-left: 8px; }
.friendlinks { float: left; position: relative; }
.friendlinks span { display: block; position: relative; padding-left: 20px; width: 198px; border: 1px solid #c5c5c5; border-radius: 18px; line-height: 42px; height: 42px; color: #c5c5c5; font-size: 14px; cursor: pointer; }
.friendlinks span.on:before { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); }
.friendlinks span:before { content: ""; width: 13px; height: 8px; background: url(../images/arrow2.png) center no-repeat; position: absolute; right: 15px; top: 50%; margin-top: -4px; transition: 288ms ease-in-out; }
.friend-down { border: 1px solid #292420; width: 218px; position: absolute; left: 0; bottom: 50px; border-radius: 18px; padding-top: 10px; padding-bottom: 10px; background: #f2f2f4; display: none; }
.friend-down li { border-bottom: 1px solid #292420; }
.friend-down li:last-child { border-bottom: none; }
.friend-down li a { display: block; padding-left: 20px; line-height: 36px; font-size: 14px; color: #292420; }
.friend-down li a:hover { color: #da3b3b; }
.footer-like .jiathis_style_32x32 { float: left; margin-left: 7px; }
.footer-like .jiathis_style_32x32 .jtico { height: 44px !important; transition: 300ms ease-in-out; margin-left: 5px; padding-left: 44px !important; }
.footer-like .jiathis_style_32x32 .jtico_tsina { background: url(../images/weib.png) center no-repeat !important; }
.footer-like .jiathis_style_32x32 .jtico_weixin { background: url(../images/weixin.png) center no-repeat !important; }
.footer-like .jiathis_style_32x32 .jtico:hover { transform: translateY(-5px); -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); }

@keyframes fadedown {
    from { transform: translateY(-100%); opacity: 0; }

    to { transform: translateY(0); opacity: 1; }
}

@-webkit-keyframes arrow {
    0% { opacity: 0; -webkit-transform: translate3d(0px, 0px, 0px); }
    33% { opacity: 1; }
    66% { opacity: 1; }
    100% { opacity: 0; -webkit-transform: translate3d(0px, 10px, 0px); }
}

@keyframes arrow {
    0% { opacity: 0; transform: translate3d(0px, 0px, 0px); }
    33% { opacity: 1; }
    66% { opacity: 1; }
    100% { opacity: 0; transform: translate3d(0px, 10px, 0px); }
}

@keyframes beat {
    from, to { -webkit-transform: scale(1, 1); transform: scale(1, 1); }

    25% { -webkit-transform: scale(0.9, 1.1); transform: scale(0.9, 1.1); }

    50% { -webkit-transform: scale(1.1, 0.9); transform: scale(1.1, 0.9); }

    75% { -webkit-transform: scale(0.95, 1.05); transform: scale(0.95, 1.05); }

    from, to { -webkit-transform: scale(1, 1); transform: scale(1, 1); }

    25% { -webkit-transform: scale(0.9, 1.1); transform: scale(0.9, 1.1); }

    50% { -webkit-transform: scale(1.1, 0.9); transform: scale(1.1, 0.9); }

    75% { -webkit-transform: scale(0.95, 1.05); transform: scale(0.95, 1.05); }
}

@-webkit-keyframes beat {
    from, to { -webkit-transform: scale(1, 1); transform: scale(1, 1); }

    25% { -webkit-transform: scale(0.9, 1.1); transform: scale(0.9, 1.1); }

    50% { -webkit-transform: scale(1.1, 0.9); transform: scale(1.1, 0.9); }

    75% { -webkit-transform: scale(0.95, 1.05); transform: scale(0.95, 1.05); }

    from, to { -webkit-transform: scale(1, 1); transform: scale(1, 1); }

    25% { -webkit-transform: scale(0.9, 1.1); transform: scale(0.9, 1.1); }

    50% { -webkit-transform: scale(1.1, 0.9); transform: scale(1.1, 0.9); }

    75% { -webkit-transform: scale(0.95, 1.05); transform: scale(0.95, 1.05); }
}

.slick-slider { position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; width: 90%;
    margin: 0 auto;}
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-list, .slick-track, .slick-slide, .slick-slide img { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; zoom: 1; display:inline-block;}
.slick-track:before, .slick-track:after { content: ""; display: table; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-prev, .slick-next { position: absolute; display: block; line-height: 0; font-size: 0; cursor: pointer; background: transparent; color: transparent; top: 50%; margin-top: -10px; padding: 0; border: none; outline: none; }
.slick-prev:focus, .slick-next:focus { outline: none; }
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }

.slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; color: white; opacity: 0.85; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: -25px; }
.slick-next { right: -25px; }

/* Dots */
.slick-slider { margin-bottom: 30px; }

.slick-dots { position: absolute; bottom: -45px; list-style: none; display: block; text-align: center; padding: 0px; width: 100%; }
.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0px 5px; padding: 0px; cursor: pointer; }
.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0; font-size: 0; color: transparent; padding: 5px; cursor: pointer; outline: none; }
.slick-dots li button:focus { outline: none; }
.slick-dots li button:before { position: absolute; top: 0; left: 0; width: 20px; height: 20px; font-family: "slick"; font-size: 6px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.slick-dots li.slick-active button:before { opacity: 0.75; }

/*关于我们*/
.innerbox { padding: 102px 60px 62px; position: relative; transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1); left: 0; overflow-x: hidden; background: #fff; }
.innerbox.on { left: 610px; }
.pbanner { position: relative; }
.pbanner figure { display: block; overflow: hidden; }
.pbanner figure img { display: block; line-height: 1; position: relative; width: 100%; }
.pbannerfix { width: 396px; height: 396px; background: url(../images/radius2.png) center no-repeat; position: absolute; left: 50%; top: 50%; margin-left: -198px; margin-top: -198px; }
.pbanner-wr { padding-top: 80px; text-align: center; }
.pbanner-wr h1 { line-height: 1; text-align: center; color: #fcf5ed; font-size: 36px; font-weight: normal; }
.pbanner-wr h2 { line-height: 1.4; text-align: center; color: #fcf5ed; font-size: 24px; font-weight: normal; }
.pbanner-wr small { display: block; text-align: center; line-height: 1; color: #fcf5ed; font-size: 20px; font-family: "Segoe Script"; margin-top: 8px; margin-bottom: 5px; }
.down { display: block; width: 42px; height: 42px; border-radius: 50%; position: absolute; left: 50%; margin-left: -21px; bottom: 54px; background: url(../images/radius3.png) center no-repeat; cursor: pointer; }
.down:before { content: ""; width: 14px; height: 20px; background: url(../images/arrow3.png) center no-repeat; position: absolute; left: 50%; margin-left: -7px; top: 8px; animation-delay: 0ms; animation-duration: 1200ms; animation-iteration-count: infinite; animation-name: arrow; animation-play-state: running; animation-timing-function: linear; }

.about { position: relative; }
.menufix { position: absolute; left: 45px; top: 50%; margin-top: -190px; z-index: 55; }
.menufix.flex { position: fixed; left: 52px; }
.menufix.flebott { top: inherit; margin-top: 0; bottom: 300px; }
.menus { position: relative; }
.menus:before { content: ""; width: 2px; height: 100%; background: #505050; position: absolute; left: 8px; top: 0; }
.menus li { margin-bottom: 60px; }
.menus li:last-child { margin-bottom: 0; }
.menus li a { display: block; padding-left: 35px; color: #505050; font-size: 14px; line-height: 18px; position: relative; }
.menus li a:before { content: ""; width: 18px; height: 18px; background: url(../images/radius11.png) center no-repeat; position: absolute; left: 0; top: 0; transition: 248ms; }
.menus li a:after { content: ""; width: 18px; height: 18px; background: url(../images/radius12.png) center no-repeat; position: absolute; left: 0; top: 0; transition: 248ms; opacity: 0; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); overflow: hidden; }
.menus li:hover a, .menus li.current a { color: #505050; }
.menus li:hover a:before, .menus li.current a:before { opacity: 0; visibility: hidden; }
.menus li:hover a:after, .menus li.current a:after { opacity: 1; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); visibility: visible; }

.introduct-box { position: relative; padding: 100px 0; background: url(../images/introduct.jpg) center no-repeat; background-size: cover !important; }
.common-t h2 { color: #505050; line-height: 1; font-size: 30px; text-align: center; margin-bottom: 10px; font-weight: normal; }
.common-t small { display: block; text-align: center; line-height: 1; color: #505050; font-size: 14px; font-family: "Arial"; text-transform: uppercase; }
.introductfix { padding:34px 50px 56px; margin-top:38px; background:#fff; border-radius:18px; opacity: 0.9;}
.introductfix strong{ display:block; text-align:center; color:#8f7f6e; font-size:18px;}
.introductfix img{ display:inline; max-width:100%;}
.introduct-fixs p{ color:#7d6b57; font-size:14px; line-height:2;}
.introduct-fixs h2{ color:#505050; font-size:18px;}
.brands{ margin-top:30px; padding:48px 32px 54px 36px; background:#fff; border-radius:18px;color: #505050;font-size: 16px;opacity: 0.9;}
.brand-info{ padding-bottom:26px; border-bottom:1px dashed #cccccc; margin-bottom:30px;}
.brand-info:last-child{ padding-bottom:0; margin-bottom:0; border-bottom:none;}
.brand-info h2{ color:#505050; font-size:18px; margin-bottom:4px;}
.brand-info p{ color:#292420; font-size:14px;}

.intro-text p { color: #505050; font-size: 14px; }
.introduct-video { margin-top: 42px; }
.video-info { width: 47.8%; float: left; position: relative; }
.video-info:nth-child(2n+2) { float: right; }
.videoIbox { position: relative; line-height: 1; }
.videoIbox .img { display: block; width: 100%; height: auto; transition: 440ms ease-in-out; line-height: 0; border-radius: 18px; }
.videoIbox span { display: block; width: 70px; height: 70px; background: url(../images/video.png) center no-repeat; position: absolute; left: 50%; top: 50%; margin-left: -35px; margin-top: -35px; z-index: 30; }
.video-info b { display: block; text-align: center; color: #505050; font-size: 18px; font-weight: normal; margin-top: 22px; line-height: 1.2; transition: 330ms; }
.video-info:hover .videoIbox .img { transform: scale(1.04); -webkit-transform: scale(1.04); -moz-transform: scale(1.04); }
.video-info:hover b { color: #505050; }
.vwrap { display: none; z-index: 1040; width: 100%; position: fixed; left: 0; top: 0; }
.vwrap .videobtg { z-index: 900; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: #000; opacity: 0.8; filter: alpha(opacity=80); overflow: hidden; }
.vwrap .videobox { z-index: 990; width: 860px; height: 480px; background-color: #fff; position: fixed; left: 50%; top: 50%; margin-top: -240px; margin-left: -430px; }
.vwrap .videobox #videobox { width: 100%; display: inline-block; height: 100%; background: #80abde; }
#videobox_wrapper { height: 100%!important; }
.vwrap .close { z-index: 999; width: 24px; height: 24px; cursor: pointer; position: absolute; top: -28px; right: 0px; }
.vwrap .close i { display: block; width: 24px; height: 24px; background: url(../images/close.png) no-repeat 50% 50%; -webkit-transition: 400ms; transition: 400ms; }
.vwrap .close:hover i { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }
#videobox_display_button { background: none no-repeat!important; }
.jwplayer .jwicon:hover { opacity: 1; filter: alpha(opacity=100); }
.jwlogo, .jwclick { display: none!important; }

.story-box { padding: 95px 0 80px; background: url(../images/story.jpg) center no-repeat; background-size: cover !important; }
.story-box2 { padding: 95px 0 80px; background: url(../images/story2.jpg) center no-repeat; background-size: cover !important; }
.brand-top { margin-top: 45px; }
.brand-top strong { display: block; text-align: center; margin-bottom: 5px; color: #837a6a; font-size: 18px; font-weight: normal; }
.brand-top p { color: #505050; font-size: 14px; text-align: center; }
.story-tab { margin-top: 42px; text-align: center; }
.storyfix { text-align: center; margin-bottom: 16px; }
.story-center { display: inline-block; margin: auto; }
.story-info { width: 140px; height: 38px; margin-bottom: 12px; display: inline-block; float: left; margin-right: 55px; border: 2px solid #c1d2d4; background: #fff; border-radius: 18px; cursor: pointer; position: relative; transition: 340ms ease-in-out; }
.story-info span { display: block; text-align: center; transition: 300ms; line-height: 34px; color: #7a6f5e; font-size: 14px; }
.story-info:last-child { margin-right: 0; }
.story-info:last-child:before { display: none; }
.story-info:before { content: ""; width: 17px; height: 18px; background: url(../images/arrow4.png) center no-repeat; position: absolute; right: -38px; top: 10px; }
.story-info:hover, .story-info.on { background: #505050; border-color: #505050; }
.story-info:hover span, .story-info.on span { color: #fff; }

.story-text { position: relative; }
.storys.on { opacity: 1; visibility: visible; top: 0; transition: 750ms 0ms; position: relative; z-index: 5; }
.storys { opacity: 0; position: absolute; visibility: hidden; left: 0; top: 80px; box-sizing: border-box; padding: 46px 40px 40px 40px; background: #fff; border-radius: 21px; }
.storys h4 { color: #505050; font-size: 16px; line-height: 1; font-weight: normal; padding-bottom: 18px; border-bottom: 1px solid #cedee0; text-align: left; }
.storyt { padding-top: 15px; }
.storyt p { color: #7a6f5e; font-size: 14px; line-height: 2.2; text-align: left; }

.profile-box { background-size: cover !important; position: relative; }
.profileimg { overflow: hidden; }
.imghide { overflow: hidden; }
.profileimg img { display: block; width: 100%; height: auto; line-height: 1; }
.profile { position: absolute; left: 50%; margin-left: -500px; top: 126px; }
.profile-text { margin-top: 38px; border-radius: 18px; background: rgba(255,255,255,0.5); background: #e5f1f7\9; padding: 46px 44px 44px 40px; }
.profile-text p { color: #505050; font-size: 14px; margin-bottom: 24px; text-indent: 32px; }
.profile-text p:last-child { margin-bottom: 0; }

.honorTop { padding: 128px 0 70px; background: #e2f2f4; }
.honor-list { margin-top: 70px; position: relative; padding: 0 47px; }
.honor-info figure { margin: 0 17px; padding: 13px; background: #fff; border-radius: 16px; transition: 430ms; background: #fff; }
.honor-info figure img { display: block; width: 100%; line-height: 1; transition: 450ms; }

.honor-info:hover figure { background: #505050; }
.honor-info:hover figure img { transform: scale(1.06); -webkit-transform: scale(1.06); -moz-transform: scale(1.06); }
.honor-list .slick-prev, .honor-list .slick-next { width: 40px; height: 40px; top: 78px; margin-top: 0; background-size: cover !important; transition: 330ms; }
.honor-list .slick-prev { left: -12px; background: url(../images/prev2.png) center no-repeat; }
.honor-list .slick-next { right: -12px; background: url(../images/next2.png) center no-repeat; }
.honor-list .slick-prev:hover { background: url(../images/prev3.png) center no-repeat; }
.honor-list .slick-next:hover { background: url(../images/next3.png) center no-repeat; }
.honor-list .slick-dots { position: relative; bottom: 0; margin-top: 34px; text-align: center; }
.honor-list .slick-dots li { display: inline-block; margin-right: 12px; width: auto; margin-left: 0; height: auto; }
.honor-list .slick-dots li:last-child { margin-right: 0; }
.honor-list .slick-dots li button { padding: 0; margin: 0; border: none; outline: none; width: 14px; height: 14px; border-radius: 50%; background: #cec8ce; cursor: pointer; transition: 355ms; }
.honor-list .slick-dots li.slick-active button { background: #505050; }
.page4 .recipes { padding-bottom: 0; }

.sundaly-box { padding: 104px 0 70px; position: relative; }
.sudalybg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(../images/abou.jpg) fixed repeat; position:absolute; left: 0; top: 0; background-attachment: fixed !important; width: 100%; height: 100%; }
.sundaly { position: relative; }
.sundat { margin-bottom: 74px; }
.sundat h4 { color: #505050; font-size: 24px; text-transform: uppercase; font-weight: normal; text-align: center; line-height: 1; margin-bottom: 12px; }
.sundat p { color: #82786d; font-size: 14px; width: 590px; margin: auto; text-align: center; }
.event { padding-top: 144px; margin-top:70px; position: relative; }
.event:before { content: ""; width: 87px; height: 144px; background: url(../images/event.png) center no-repeat; position: absolute; left: 50%; margin-left: -43px; top: 0; }
.event-list { background: url(../images/event1.png) center top repeat-y; padding-bottom: 110px; }
.event-list li { position: relative; }
.event-list li:last-child .event-item:last-child { margin-bottom: 0; }
.event-item { margin-bottom: 191px; position: relative; }
.item-one { padding-left: 518px; z-index: 99; }
.event-middle { width: 146px; }
.event-middle strong { float: right; color: #8b8b8b; font-weight: normal; font-size: 14px; line-height: 1; }
.event-middle strong em { display: inline-block; font-family: "exotic_350_demi-bold"; font-size: 36px; margin-right: 6px; font-style: normal; transition: 300ms; }
.event-middle .event-icon { width: 24px; height: 24px; float: left; background: url(../images/radius4.png) center no-repeat; margin-top: 5px; position: relative; }
.event-middle .event-icon:before { content: ""; width: 28px; height: 1px; background: #505050; position: absolute; left: -28px; top: 50%; }
.event-text { position: absolute; width: 437px; padding: 3px; background: #fff; border-radius: 18px; top: -24px; transition: 340ms; }
.event-item:hover .event-text { background: #505050; }
.event-item:hover .event-middle strong em { color: #505050; }
.event-item:hover .event-wr:before { transform: rotate(180deg); }
.event-wr { padding: 19px 30px; position: relative; background: #fff; border-radius: 18px; }
.event-hidden { max-height: 80px; overflow: hidden; transition: 340ms; }
.event-wr.clickshow .event-hidden { max-height: none; }
.event-wr.downshow { padding-bottom: 48px; }
.event-wr.downshow:before { opacity: 1; visibility: visible; }
.event-wr:before { content: ""; width: 31px; height: 18px; background: url(../images/downshow.png) center no-repeat; position: absolute; right: 30px; bottom: 10px; transition: 300ms; cursor: pointer; opacity: 0; visibility: hidden; }
.item-one .event-text { left: 55px; }
.event-info { margin-bottom: 6px; }
.event-info:last-child { margin-bottom: 0; }
.event-info b { display: inline-block; float: left; width: 32px; color: #505050; font-size: 14px; font-weight: normal; }
.event-info p { display: inline-block; float: left; margin-left: 18px; width: 326px; color: #8b8b8b; font-size: 14px; }
.item-two { margin-bottom: 166px; padding-left: 387px; z-index: 98; }
.event-item:nth-child(2n+2) .event-middle .event-icon { float: right; }
.event-item:nth-child(2n+2) .event-middle .event-icon:before { left: 24px; }
.event-item:nth-child(2n+2) .event-middle strong { float: left; }
.item-two .event-text { left: 557px; }
.item-three { margin-bottom: 170px; padding-left: 453px; z-index: 97; }
.item-three .event-text { left: -10px; }
.item-four { padding-left: 346px; margin-bottom: 130px; z-index: 96; }
.item-four .event-text { left: 518px; }
.item-five { padding-left: 514px; z-index: 95; }
.item-five .event-text { left: 48px; }
.lined { width: 87px; height: 96px; left: 50%; margin-left: -36px; position: relative; background: url(../images/line.png) center no-repeat; }
.lined span { color: #8b8b8b; font-size: 14px; display: inline-block; line-height: 1; position: absolute; right: -88px; bottom: 0; }

.cooperate-box { padding: 125px 0 94px; background: url(../images/cooperate.jpg) center top no-repeat; background-size: cover; }
.cooperate-text { margin-top: 50px; }
.cooperatfix { margin-bottom: 36px; border-radius: 16px; background: rgba(255,255,255,0.5); background: #fff\9; filter: alpha(opacity=50); padding: 44px; }
.cooperatfix p { color: #505050; font-size: 14px; }
.cooper-span { padding: 6px 0; background: #505050; text-align: center; border-radius: 22px; }
.cooper-span span { display: inline-block; width: 142px; height: 39px; line-height: 39px; text-align: center; color: #ffffff; font-size: 14px; border-radius: 18px; margin-right: 6px; cursor: pointer; background: #f59464; position: relative; transition: 288ms ease-in-out; }
.cooper-span span:last-child { margin-right: 0; }
.cooper-span span:before { content: ""; width: 23px; height: 11px; background: url(../images/arrow5.png) center no-repeat; position: absolute; left: 50%; margin-left: -11px; bottom: -8px; transition: 288ms ease-in-out; opacity: 0; visibility: hidden; }
.cooper-span span:hover, .cooper-span span.on { background: #fff; color: #897570; }
.cooper-span span:hover:before, .cooper-span span.on:before { opacity: 1; bottom: -11px; visibility: visible; }

.cooper-list { margin-top: 40px; position: relative; }
.cooper-info { opacity: 0; position: absolute; top: 65px; display: none\9; position: absolute; left: 0; filter: alpha(opacity=0); }
.cooper-info.on { position: relative; top: 0; opacity: 1; visibility: visible; transition: 680ms; filter: alpha(opacity=100); display: block\9; }
.cooper-in { float: left; width: 151px; margin-bottom: 22px; margin-right: 18px; }
.cooper-in:nth-child(6n+6) { margin-right: 0; }
.cooper-in figure { display: block; line-height: 1; overflow: hidden; margin-bottom: 8px; position: relative; border-radius: 16px; }
.cooper-in figure img { display: block; width: 100%; height: auto; line-height: 1; border-radius: 16px; transition: 320ms; }
.cooper-in span { display: block; text-align: center; color: #68524b; font-size: 14px; transition: 300ms; }
.cooper-in:hover figure img { transform: scale(0.85); -webkit-transform: scale(0.85); -moz-transform: scale(0.85); }
.cooper-in:hover span { color: #505050; }

/*产品中心*/
.product-box { background: #f2f2f4; }
.devote { position: absolute; left: 50%; margin-left: -500px; top: 31.3%; }
.devotefix { width: 580px; }
.devotefix h1 { color: #505050; font-size: 36px; font-weight: normal; line-height: 1; margin-bottom: 18px; }
.devotefix p { color: #766047; font-size: 14px; }
.devotefix .down { position: relative; left: 0; top: 0; margin-left: 0; bottom: 0; margin-top: 146px; }
.product-btn { width: 1050px; margin: auto; position: relative; }
.product-tp { padding: 32px 0 0; position: relative; background: #fffbe9; }
.product-tp:before { content: ""; width: 100%; height: 21px; background: #f2f2f4; position: absolute; left: 0; bottom: 0; }
.product-tp:after { content: ""; width: 100%; height: 4px; background: #505050; position: absolute; left: 0; bottom: 17px; }
.product-btn .eggsimg .more { display: none; }
.product-btn .eggs-info .eggstext strong { width: 68px; height: 43px; margin-bottom: 7px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; box-align: center; -webkit-box-align: center; align-items: center; -webkit-align-items: center; }
.product-btn .eggs { margin: 0; }
.product-btn .eggs-info .eggsimg { padding: 0; }
.product-btn .eggs-info:nth-child(1) .eggstext strong { width: 48px; }
.product-btn .eggs-info:nth-child(2) .eggstext strong { width: 64px; }
.product-btn .eggs-info:nth-child(3) .eggstext strong { width: 68px; }
.product-btn .eggs-info:nth-child(4) .eggstext strong { width: 26px; }
.product-btn .eggstext { margin-top: -50px; }
.product-btn .eggstext span { font-size: 18px; margin-bottom: 10px; }
.product-btn .eggstext b { font-size: 22px; }
.product-btn .eggs-info { padding-bottom: 62px; position: relative; padding-top: 20px; }
.product-btn .eggs-info:before { content: ""; width: 36px; height: 36px; background: url(../images/radius5.png) center no-repeat; position: absolute; left: 50%; margin-left: -18px; bottom: 2px; opacity: 0; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transition: 355ms ease-in-out; visibility: hidden; }
.product-btn .eggs-info:hover:before, .product-btn .eggs-info.on:before { opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); }
.product-btn .eggs .slick-prev, .product-btn .eggs .slick-next { transform: scale(0.78); -webkit-transform: scale(0.78); -moz-transform: scale(0.78); }
.products { padding: 58px 0 54px; }
.product-t { margin-bottom: 54px; text-align: center; }
.product-t h3 { line-height: 1; padding-bottom: 24px; color: #505050; font-size: 30px; font-weight: normal; position: relative; border-bottom: 1px solid #ada399; margin-bottom: 22px; }
.product-t h3:before { content: ""; width: 15px; height: 15px; background: #f2f2f4 url(../images/rad.png) center no-repeat; position: absolute; left: 50%; margin-left: -7px; bottom: -7px; }
.product-t p { color: #505050; font-size: 14px; width: 790px; margin: auto; }
.productimg { position: relative; margin-bottom: 44px; }
.productimg .producttab > li { position: relative; border-radius: 18px; }
.productimg .producttab > li:before { content: ""; width: 100%; height: 100%; border: 3px solid #fff; border-radius: 18px; box-sizing: border-box; position: absolute; left: 0; top: 0; }
.productimg .producttab > li img { display: block; width: 100%; height: auto; line-height: 0; border-radius: 18px; }
.productimg .flex-control-nav { text-align: center; margin-top: 24px; }
.productimg .flex-control-nav li { display: inline-block; margin-right: 12px; }
.productimg .flex-control-nav li:last-child { margin-right: 0; }
.productimg .flex-control-nav li span { display: inline-block; width: 14px; height: 14px; text-indent: 999px; overflow: hidden; border-radius: 50%; background: #c9bcaf; position: relative; }
.productimg .flex-control-nav li span:before { content: ""; width: 100%; height: 0; bottom: 0; position: absolute; left: 0; background: #505050; border-radius: 50%; transition: 288ms ease-in-out; }
.productimg .flex-control-nav li a.flex-active span:before { height: 100%; }
.productimg .flex-direction-nav li a { width: 40px; height: 40px; display: block; position: absolute; top: 42.7%; text-indent: 888px; overflow: hidden; transition: 300ms ease-in-out; z-index: 20; }
.productimg .flex-direction-nav li a.flex-prev { background: url(../images/prev2.png) center no-repeat; left: -84px; }
.productimg .flex-direction-nav li a.flex-next { background: url(../images/next2.png) center no-repeat; right: -84px; }
.productimg .flex-direction-nav li a.flex-prev:hover { background: url(../images/prev3.png) center no-repeat; }
.productimg .flex-direction-nav li a.flex-next:hover { background: url(../images/next3.png) center no-repeat; }
.proview { padding: 44px 44px 60px 44px; background: #fff; border-radius: 18px; border: 3px solid rgba(255,255,255,0.4); }
.proimg { width: 41.4%; float: left; text-align: center; height: 270px; isplay: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; box-align: center; -webkit-box-align: center; align-items: center; -webkit-align-items: center; }
.proimg img { display: block; max-width: 100%; margin: auto; height: auto; line-height: 1; }
.protext { width: 45%; float: right; }
.protext p { color: #76665e; font-size: 14px; border-bottom: 1px solid #c9bcaf; line-height: 38px; }
.crowd { margin-top: 26px; background: #fff; border-radius: 18px; border: 3px solid rgba(255,255,255,0.4); padding: 40px 40px 44px; }
.crowd-info { float: left; width: 404px; }
.crowd-info span { width: 60px; height: 51px; float: left; }
.crowd-text { float: left; margin-left: 16px; }
.crowd-text h4 { color: #76665e; font-size: 18px; font-weight: normal; line-height: 1; margin-bottom: 14px; }
.crowd-text p { color: #76665e; font-size: 14px; line-height: 1.4; width: 325px; }
.crowd-info:nth-child(1) span { background: url(../images/crowd1.png) center no-repeat; }
.crowd-info:nth-child(2) span { background: url(../images/crowd2.png) center no-repeat; }
.crowd-info:nth-child(2) { float: right; }
.goto { width: 215px; height: 49px; margin: auto; margin-top: 42px; border-radius: 24px; background: #505050; position: relative; transition: 320ms; }
.goto a { display: block; padding-left: 85px; line-height: 49px; color: #fff; font-size: 14px; position: relative; }
.goto a:before { content: ""; width: 47px; height: 21px; background: url(../images/mar.png) center no-repeat; position: absolute; left: 26px; top: 13px; }
.goto a:after { content: ""; width: 9px; height: 17px; background: url(../images/arrow.png) center no-repeat; position: absolute; right: 34px; top: 16px; transition: 300ms; }
.goto:hover { background: #c60707; }
.goto:hover a:after { right: 28px; }

.investorb { position: relative; }
.investorb figure { display: block; line-height: 1; overflow: hidden; position: relative; }
.recipesb .investorb figure img { display: block; width: 100%; height: auto; line-height: 0; opacity: 0; visibility: hidden; }
.investorb figure img { display: block; width: 100%; height: auto; }
.investorb .ivestfix { position: absolute; left: 50%; margin-left: -500px; top: 25.6%; }
.investorb .ivestfix h3 { color: #ffffff; line-height: 1; font-weight: normal; font-size: 36px; margin-bottom: 8px; }
.investorb .ivestfix small { color: #ffffff; font-size: 14px; font-family: Arial; display: block; line-height: 1; text-transform: uppercase; }
.investor-box { background: #f2f2f4; padding-bottom: 62px; }
.investor-bg { background: #505050; }
.investor-list li { float: left; position: relative; margin-right: 6px; }
.investor-list li:before { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #fff; transform-origin: left bottom; -webkit-transform-origin: left bottom; -webkit-transition: -webkit-transform .4s cubic-bezier(.4,0,.2,1); transition: -webkit-transform .4s cubic-bezier(.4,0,.2,1); transition: transform .4s cubic-bezier(.4,0,.2,1); transition: transform .4s cubic-bezier(.4,0,.2,1),-webkit-transform .4s cubic-bezier(.4,0,.2,1); transform: scaleY(0); -webkit-transform: scaleY(0); }
.investor-list li a { display: inline-block; padding: 0 66px 0 42px; color: #fff; font-size: 14px; line-height: 57px; position: relative; }
.investor-list li a:before { content: ""; width: 17px; height: 9px; background: url(../images/arrow6.png) center no-repeat; position: absolute; right: 32px; top: 20px; opacity: 0; visibility: hidden; transition: 308ms 220ms; }
.investor-list li:hover:before, .investor-list li.now:before { transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transform-origin: left top; -webkit-transform-origin: left top; }
.investor-list li:hover a, .investor-list li.now a { color: #292420; }
.investor-list li:hover a:before, .investor-list li.now a:before { top: 24px; opacity: 1; visibility: visible; }

.informate { background: #fff; border-radius: 18px; }
.informate-left { width: 178px; padding-top: 30px; float: left; }
.informate-left .investor-list li { width: 100%; background: #fff; transition: 288ms; margin-right: 0; border-bottom: 1px solid #dcdcdc; }
.informate-left .investor-list li a { color: #505050; display: block; }
.informate-left .investor-list li a:before { width: 9px; height: 17px; right: 15px; top: 50%; margin-top: -8px; background: url(../images/arrow.png) center no-repeat; }
.informate-left .investor-list li:before { background: #505050; }
.informate-left .investor-list li:hover, .informate-left .investor-list li.now { border-bottom-color: #fff; }
.informate-left .investor-list li:hover a, .informate-left .investor-list li.now a { color: #fff; }
.informates { width: 821px; border-left: 1px solid #dcdcdc; float: right; }
.informas { padding: 36px 32px 72px 53px; }
.informate-wr { background: #fff; padding: 36px 32px 72px 53px; }
.informate h3 { color: #505050; font-size: 18px; line-height: 1; font-weight: normal; padding-bottom: 18px; border-bottom: 1px solid #dcdcdc; }
.informate-text { margin-top: 22px; }
.informate-list { margin-bottom: 12px; display: block; }
.informate-list dt { display: inline-block; width: 90px; float: left; font-weight: normal; color: #73675c; font-size: 14px; }
.informate-list dd { display: inline-block; color: #73675c; font-size: 14px; width: 820px; }

.iphone-fix { width: 100%; background: #505050; display: none; position: relative; z-index: 20; }
.iphone-fix span { color: #fff; display: block; text-align: center; font-size: 14px; height: 46px; line-height: 46px; cursor: pointer; }
.iphone-fix.scoll { position: fixed; left: 0; top: 90px; }
.iphone-fix span em { color: #fff; font-size: 14px; font-style: normal; line-height: 46px; display: inline-block; }
.iphone-fix span b { display: inline-block; margin-left: 5px; width: 13px; height: 8px; background: url(../images/arrow7.png) center no-repeat; }
.iphone-down { width: 100%; position: absolute; left: 0; display: none; top: 46px; background: #505050; }
.iphone-down a { display: block; font-size: 14px; text-align: center; height: 42px; line-height: 42px; color: #fff; position: relative; overflow: hidden; border: none !important; }
.iphone-down a:hover, .iphone-down a.on { background: #f2af09; }

.iphone-down a:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; z-index: 1; background-color: #f8f0dc; -webkit-animation-duration: 0.7s; animation-duration: 0.7s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: ReturnToNormal; animation-name: ReturnToNormal; }

@-webkit-keyframes ReturnToNormal {
    0% { -webkit-transform: scale(0.1,1); -ms-transform: scale(0.1,1); transform: translate: scale(0.1,1); }


    100% { -webkit-transform: scaleX(1,1); -ms-transform: scale(1,1); transform: translate: scaleX(1,1); }
}

@keyframes ReturnToNormal {
    0% { -webkit-transform: scale(0.1,1); -ms-transform: scale(0.1,1); transform: translate: scale(0.1,1); }


    100% { -webkit-transform: scaleX(1,1); -ms-transform: scale(1,1); transform: translate: scaleX(1,1); }
}

.goverman { margin-bottom: 22px; padding-left: 78px; }
.goverman-info { display: inline-block; float: left; background: #fff; margin-right: 12px; position: relative; border: 2px solid #c1d2d4; border-radius: 20px; transition: 300ms ease-in-out; overflow: hidden; }
.goverman-info:before { content: ""; width: 100%; height: 100%; background: #505050; position: absolute; left: 0; top: 0; transition: 300ms ease-in-out; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transform-origin: center; visibility: hidden; border-radius: 18px; }
.goverman-info a { display: inline-block; padding: 0 45px; height: 40px; line-height: 40px; color: #292420; font-size: 14px; position: relative; }
.goverman-info:hover, .goverman-info.on { border-color: #505050; background: #505050; }
.goverman-info:hover:before, .goverman-info.on:before { transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); visibility: visible; }
.goverman-info:hover a, .goverman-info.on a { color: #fff; }
.govermance-list { border-top: 1px solid #e5e5e5; padding-top: 6px; }
.govermance-list li { border-bottom: 1px dashed #cccccc; }
.govermance-list li span { display: inline-block; float: left; line-height: 54px; color: #505050; font-size: 14px; padding-left: 18px; position: relative; transition: 240ms; }
.govermance-list li span:before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #acacab; position: absolute; left: 1px; top: 50%; margin-top: -3px; transition: 240ms; }
.govermance-list li time { display: inline-block; float: right; line-height: 54px; color: #999999; font-size: 14px; font-family: Arial; transition: 240ms; }
.govermance-list li:hover span { color: #505050; }
.govermance-list li:hover span:before { background: #505050; }
.govermance-list li:hover time { color: #505050; }
.page-list { margin-top: 38px; text-align: center; }
.page-wr { display: inline-block; margin: auto; }
.page-list a, .page-list span { display: inline-block; color: #766047; font-size: 18px; font-weight: bold; font-family: Arial; margin-right: 10px!important; width: 26px; height: 40px; line-height: 40px; text-align: center; float: left; }
.page-list a:hover, .page-list span { color: #505050!important; }
.page-list a.pprev { width: 40px; height: 40px; }
.page-list a.prev { background: url(../images/prev2.png) center no-repeat; margin-right: 17px!important; }
.page-list a.prev:hover { background: url(../images/prev3.png) center no-repeat; }
.page-list a.next { background: url(../images/next2.png) center no-repeat; margin-right: 0!important; margin-left: 7px; }
.page-list a.next:hover { background: url(../images/next3.png) center no-repeat; }
.goverpadd { padding-bottom: 36px; }
.message { padding: 0; background: #fff; }
.message h2 { color: #505050; font-size: 24px; line-height: 1; font-weight: normal; text-align: center; margin-bottom: 38px; }
.row { float: left; margin-right: 14px; margin-bottom: 13px; border-radius: 20px; }
.row .inptext { width: 333px; padding-left: 26px; padding-top: 0; background: #fff; padding-bottom: 0; height: 42px; line-height: 42px; color: #73675c; border: 1px solid #c7d2d3; float: left; font-size: 14px; font-family: "微软雅黑"; margin: 0; border-radius: 20px; outline: none; transition: 300ms; }
.row:nth-child(2n+2) { margin-right: 0; }
.row .inptext:focus { border-color: #505050; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #73675c; }
input:-moz-placeholder, textarea:-moz-placeholder { color: #73675c; }
.row textarea { padding: 12px 26px; float: left; background: #fff; border-radius: 20px; color: #73675c; background: #fff; font-family: "微软雅黑"; margin: 0; outline: none; width: 680px; transition: 300ms; border: 1px solid #c7d2d3; height: 94px; }
.row textarea:focus { border-color: #505050; }
.rimg { width: 116px; height: 44px; cursor: pointer; line-height: 1; float: left; margin-left: 12px; }
.row .change { display: inline-block; line-height: 1; float: left; margin-left: 15px; padding-top: 32px; color: #357cb8; text-decoration: underline; }
.row .change:hover { color: #505050; }
.rowinput { width: 100%; float: left; }
.rowinput .sub { width: 147px; height: 42px; line-height: 42px; text-align: center; color: #fff; font-size: 14px; padding: 0; border: none; border-radius: 20px; background: #505050; outline: none; cursor: pointer; font-family: "微软雅黑"; transition: 320ms; }
.rowinput .sub:hover { background: #505050; }
.row-text { margin-top: 50px; width: 100%; float: left; }
.row-text p { color: #73675c; }

/*new*/
.eventnew { position: absolute; left: 50%; margin-left: -500px; top: 65%; margin-top: -117px; }
.eventnew h2 { color: #505050; font-size: 36px; line-height: 1; font-weight: normal; margin-bottom: 10px; }
.eventnew small { display: block; color: #505050; font-size: 14px; font-family: Arial; line-height: 1; margin-bottom: 14px; text-transform: uppercase; }
.eventnew p { color: #505050; font-size: 16px; }
.eventnew .down { display: block; width: 42px; height: 42px; border-radius: 50%; margin-top: 30px; background: url(../images/radius3.png) center no-repeat; cursor: pointer; position: relative; left: 0; top: 0; margin-left: 0; }
.eventnew .down:before { content: ""; width: 14px; height: 20px; background: url(../images/arrow3.png) center no-repeat; position: absolute; left: 50%; margin-left: -7px; top: 8px; animation-delay: 0ms; animation-duration: 1200ms; animation-iteration-count: infinite; animation-name: arrow; animation-play-state: running; animation-timing-function: linear; }

.new { padding: 24px 0 0; }
.new-infos { margin-bottom: 32px; background: #ffffff; border-radius: 18px; border: 3px solid rgba(255,255,255,0.42); position: relative; }
.newimg { width: 50%; float: left; position: relative; border-radius: 18px; overflow: hidden; }
.newimg img { display: block; line-height: 1; width: 100%; height: auto; border-radius: 18px; }
.newimg time { display: block; padding: 18px 20px; background: #fff; border-radius: 16px; position: absolute; left: 20px; top: 20px; z-index: 10; }
.newimg time strong { display: block; color: #8b8b8b; font-size: 36px; font-family: "exotic_350_demi-bold"; font-weight: normal; line-height: 1; }
.newimg time b { display: block; text-align: right; color: #8b8b8b; font-size: 16px; line-height: 1; font-weight: normal; margin-top: 10px; }
.new-text { width: 50%; height: 100%; position: absolute; right: 0; top: 0; }
.new-wr { padding: 48px 45px 0; }
.new-wr h3 { color: #505050; font-size: 24px; font-weight: normal; line-height: 1.2; transition: 320ms; margin-bottom: 28px; }
.new-wr p { color: #505050; line-height: 2; margin-bottom: 35px; height: 96px; overflow: hidden; }
.new-wr span { display: inline-block; padding-left: 40px; color: #665a54; font-size: 14px; line-height: 32px; background: url(../images/arrow8.png) left center no-repeat; transition: 320ms; }
.new-infos .new-wr span:hover { color: #505050; background: url(../images/arrow10.png) left center no-repeat; }

.new-list li { margin-bottom: 16px; }
.new-left { float: left; width: 75%; background: #ffffff; border: 3px solid rgba(255,255,255,0.42); border-radius: 16px; position: relative; transition: 320ms 0ms ease-in-out; }
.new-left:before { content: ""; width: 100%; height: 100%; background: #505050; transition: 320ms ease-in-out; position: absolute; left: 0; top: 0; border-radius: 16px; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); overflow: hidden; transform-origin: center; }
.new-content { padding: 40px 36px 38px; position: relative; }
.new-content .newtime { float: left; padding-bottom: 16px; border-bottom: 1px solid #8b8b8b; position: relative; }
.new-content .newtime:before { content: ""; width: 0%; height: 1px; background: #fff; position: absolute; left: 0; bottom: -1px; transition: 300ms ease-in-out; }
.new-content .newtime strong { display: block; color: #8b8b8b; font-size: 36px; font-family: "exotic_350_demi-bold"; font-weight: normal; line-height: 1; transition: 288ms; }
.new-content .newtime b { display: block; text-align: right; font-family: "exotic_350_demi-bold"; color: #8b8b8b; font-size: 16px; line-height: 1; font-weight: normal; margin-top: 10px; transition: 288ms; }
.newfix { width: 560px; float: right; }
.newfix h4 { color: #505050; font-size: 16px; height: 28px; overflow: hidden; margin-bottom: 14px; transition: 288ms; }
.newfix p { color: #8b8b8b; height: 42px; overflow: hidden; transition: 288ms; }
.new-list li figure { display: block; width: 225px; border: 3px solid rgba(255,255,255,0.42); float: right; position: relative; border-radius: 16px; overflow: hidden; }
.new-list li figure img { display: block; width: 100%; height: 163px; line-height: 1; border-radius: 16px; }
.new-list li:hover .new-left:before { transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); }
.new-list li:hover .new-content .newtime strong,
.new-list li:hover .new-content .newtime b,
.new-list li:hover .newfix h4,
.new-list li:hover .newfix p { color: #fff; }
.new-list li:hover .new-content .newtime:before { width: 100%; visibility: visible; }
.new-list li:hover .new-left { border-color: #505050; background: #505050; transition: 320ms 100ms ease-in-out; }

.viewbox { padding: 79px 0 100px; background: #f2f2f4; }
.view-top { margin-bottom: 28px; }
.viewlist { float: left; padding-left: 6px; }
.pagenext { width: 40px; height: 40px; float: left; display: block; }
.backl { height: 38px; line-height: 38px; color: #505050; font-size: 14px; padding-left: 52px; padding-right: 25px; float: left; display: inline-block; position: relative; border: 1px solid #505050; border-radius: 18px; color: #505050; font-size: 14px; margin-left: 28px; margin-right: 28px; transition: 300ms; }
.backl:before { content: ""; width: 20px; height: 13px; position: absolute; left: 21px; top: 50%; margin-top: -6px; background: url(../images/backs.png) center no-repeat; }
.viewlist .prev1 { background: url(../images/prev2.png) center no-repeat; }
.viewlist .prev1:hover { background: url(../images/prev3.png) center no-repeat; }
.viewlist .prev2 { background: url(../images/next2.png) center no-repeat; }
.viewlist .prev2:hover { background: url(../images/next3.png) center no-repeat; }
.backl:hover { color: #fff; background: #505050; }
.backl:hover:before { background: url(../images/backs1.png) center no-repeat; }
.view-share { float: right; margin-top: 16px; }
.view-share > span { display: inline-block; padding-right: 26px; float: left; color: #665a54; font-size: 14px; line-height: 23px; background: url(../images/share.png) right center no-repeat; margin-right: 14px; }
.view-share .jiathis_style_32x32 .jtico { width: 21px; height: 23px !important; padding-left: 0 !important; margin-left: 10px; transition: 300ms; }
.view-share .jiathis_style_32x32 .jtico.jtico_tsina { background: url(../images/wib.png) center no-repeat; }
.view-share .jiathis_style_32x32 .jtico.jtico_tsina:hover { background: url(../images/wib1.png) center no-repeat; }
.view-share .jiathis_style_32x32 .jtico.jtico_weixin { background: url(../images/wex.png) center no-repeat; }
.view-share .jiathis_style_32x32 .jtico.jtico_weixin:hover { background: url(../images/wex1.png) center no-repeat; }
.view-share .jiathis_style_32x32 .jtico.jtico_qzone { background: url(../images/qq.png) center no-repeat; }
.view-share .jiathis_style_32x32 .jtico.jtico_qzone:hover { background: url(../images/qq1.png) center no-repeat; }
.view-share .jiathis_style_32x32 { float: left; }
.views { padding: 45px 44px 64px; background: #fff; border-radius: 18px; }
.view-t { margin-bottom: 18px; border-bottom: 1px solid #dedede; padding-bottom: 28px; }
.views .viewt p, .views .viewt span { font-family: 'Microsoft YaHei'!important; }
.view-t h3 { color: #505050; font-size: 24px; font-weight: normal; margin-bottom: 14px; }
.viewtime span { display: inline-block; float: left; margin-right: 10px; padding-left: 30px; color: #999999; font-family: "Arial"; line-height: 16px; }
.viewtime span:nth-child(1) { padding-left: 20px; background: url(../images/time.png) left center no-repeat; }
.viewtime span:nth-child(2) { background: url(../images/eye.png) left center no-repeat; }
.viewt p { line-height:180%;}
.viewt p, .viewt span { color: #665a54!important; font-size: 14px!important; }
.viewt img { display: inline-block; height: auto!important; max-width: 100%; width: auto!important; }

/*美食美铺*/
.resipei { top: 10%; margin-top: 0; }
.recipes-box { margin-top: -190px; padding-bottom: 80px; }
.recipes-list li { margin-bottom: 32px; position: relative; }
.recipes-list li figure { display: block; overflow: hidden; border-radius: 22px; border: 3px solid rgba(255,255,255,0.42); }
.recipes-list li figure img { display: block; width: 100%; height: auto; border-radius: 18px; }
.stage { width: 86px; height: 58px; background: url(../images/radius1.png) center no-repeat; position: absolute; left: 38px; top: 34px; padding-top: 28px; text-align: center; }
.stage strong { display: inline-block; color: #7e6d5c; font-size: 34px; font-family: "Arial"; line-height: 1; font-weight: normal; }
.stage b { display: inline-block; color: #7e6d5c; margin-left: 4px; font-weight: normal; font-size: 14px; line-height: 1; }
.recipes-wr { position: relative; margin: 0 3px 3px; background: url(../images/repiebg.png) left top repeat-x; padding-top: 153px; height: 78px; border-radius: 0 0 18px 18px; transition: 320ms; }
.recipesbg { width: 100%; position: absolute; left: 0; bottom: 0px; }
.recipesbg h4 { color: #ffffff; font-size: 24px; font-weight: bold; line-height: 1; margin-top: 17px; margin-left: 42px; float: left; text-transform: uppercase; }

.recipesbg .commons { float: right; margin-right: 22px; }
.recipesbg .more { opacity: 1; top: 0; float: right; margin-top: 0; }
.recipesbg .more span { color: #505050; transition: 300ms; position: relative; background: url(../images/arrow1.png) 121px center no-repeat; font-size: 14px; }
.recipesbg .more:hover span { color: #fff; background: url(../images/arrow.png) 121px center no-repeat; }
.recipes-list li:hover .recipes-wr { background: url(../images/repiebg1.png) left top repeat-x; }


.recipesimg { margin-bottom: 20px; position: relative; }
.recipesimg figure { display: block; overflow: hidden; border-radius: 22px; border: 3px solid rgba(255,255,255,0.42); }
.recipesimg figure img { display: block; width: 100%; height: auto; border-radius: 18px; }
.recipesimg .recipes-wr h4 { float: none; text-align: center; }
.recipesfix { padding: 46px 43px 20px; background: #fff; border-radius: 18px; border: 3px solid rgba(255,255,255,0.42); }
.recipes-li { display: block; margin-bottom: 50px; }
.recipes-li dt { display: block; line-height: 1; color: #505050; font-size: 24px; font-weight: normal; padding-bottom: 18px; border-bottom: 1px solid #dfd6cf; }
.recipes-li dd { display: block; padding-top: 18px; }
.recipes-li dd p { color: #665a54; font-size: 14px; line-height: 2; }
.ingredients { width: 500px; }
.ingredients li { color: #665a54; float: left; font-size: 14px; padding-left: 20px; width: 146px; position: relative; }
.ingredients li:before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #c4b5ac; position: absolute; left: 4px; top: 50%; margin-top: -4px; }
.steps li { margin-bottom: 12px; }
.steps li b { display: block; width: 26px; height: 26px; border-radius: 50%; color: #fff; text-align: center; line-height: 26px; background: #99867a; font-size: 14px; font-weight: normal; font-family: "Arial"; float: left; }
.steps li span { display: inline-block; float: left; color: #665a54; font-size: 14px; line-height: 26px; margin-left: 20px; width: 860px; }

.contact { padding: 156px 0 104px; background-size: cover !important; }
.contact-wr { left: -88px; position: relative; }
.contact-t { margin-bottom: 50px; }
.contact-t h3 { color: #505050; font-size: 36px; font-weight: normal; line-height: 1; margin-bottom: 8px; }
.contact-t small { display: block; color: #ccbaaa; font-size: 14px; font-family: "Arial"; line-height: 1; margin-bottom: 18px; text-transform: uppercase; }
.contact-t p { color: #64492c; font-size: 16px; }
.contact-content { padding: 46px 23px 64px; background: #fff; border-radius: 18px; width: 438px; }
.contactmap li { position: relative; }
.contactmap li:before { content: ""; width: 93.6%; height: 1px; background: #c9c9c9; position: absolute; left: 3.2%; bottom: 0; z-index: 20; transition: 240ms; }
.contatop { position: relative; padding: 0 14px; cursor: pointer; }
.contatop:before { content: ""; width: 100%; height: 0%; background: #505050; position: absolute; left: 0; top: 0; opacity: 0; visibility: hidden; transition: 300ms; }
.contatop span { display: block; color: #64492c; font-size: 14px; line-height: 53px; position: relative; }
.contatop span:before { content: ""; width: 17px; height: 10px; background: url(../images/arrow9.png) center no-repeat; position: absolute; right: 12px; top: 30%; margin-top: -4px; transition: 288ms 0ms; opacity: 0; }
.conmap { padding: 20px 20px 35px; background: #f2f2f4; display: none; }
.conmap p { color: #665a54; font-size: 14px; margin-bottom: 4px; }
.conmap a { display: inline-block; padding-left: 28px; color: #505050; font-size: 14px; line-height: 20px; background: url(../images/map.png) left center no-repeat; margin-top: 22px; position: relative; }
.conmap a:hover { color: #505050; background: url(../images/map1.png) left center no-repeat; }
.contactmap li:nth-child(1) .conmap { display: block; }
.contactmap li:hover .contatop:before, .contactmap li.on .contatop:before { opacity: 1; visibility: visible; height: 100%; }
.contactmap li:hover .contatop span:before, .contactmap li.on .contatop span:before { top: 50%; transition: 288ms 120ms; opacity: 1; }
.contactmap li:hover:before, .contactmap li.on:before { opacity: 0; visibility: hidden; }
.farmbanner { position: absolute; left: 50%; margin-left: -500px; top: 50%; margin-top: -293px; }
.farmb { background-size: cover !important; }
.farmb figure { opacity: 0; overflow: hidden; }
.farmtop { margin-bottom: 60px; }
.farmtop h3 { color: #505050; font-size: 36px; font-weight: normal; text-align: center; line-height: 1; margin-bottom: 8px;margin-top: 30px; }
.farmtop small { display: block; text-align: center; line-height: 1; text-transform: uppercase; color: #505050; font-size: 14px; margin-bottom: 10px; }
.farmtop p { color: #5f7884; font-size: 16px; text-align: center; }
.farmborder { position: relative; width: 484px; height: 484px; margin: auto; border: 3px solid #fff; border-radius: 50%; }
.farmborder .video-info { z-index: 200; width: 260px; height: 260px; padding: 10px; border-radius: 50%; background: rgba(255,255,255,0.7); background: #fff\9; filter: alpha(opacity=70); position: absolute; left: 50%; margin-left: -140px; margin-top: -140px; top: 50%; }
.farmborder .videoIbox .img { border-radius: 50%; }
.farmborder .video-info:hover .videoIbox .img { transform: scale(1.02); -webkit-transform: scale(1.02); -moz-transform: scale(1.02); }
.farmborder .video-info .videoIbox:before { content: ""; width: 100%; height: 100%; border-radius: 50%; position: absolute; left: 0; top: 0; background: rgba(43,66,36,0.5); background: #2b4224\9; filter: alpha(opacity=50); z-index: 10; }
.farm-list li { width: 129px; height: 105px; text-align: center; transition: 320ms; padding-top: 24px; position: absolute; }
.farm-list li:after { content: ""; width: 100%; height: 100%; background: url(../images/radius6.png) center no-repeat; background-size: cover !important; position: absolute; left: 0; top: 0; transition: all 0.5s ease 0s; -webkit-transform: all 0.5s ease 0s; }
.farm-list li:before { content: ""; width: 100%; height: 100%; background: url(../images/radius7.png) center no-repeat; background-size: cover !important; position: absolute; left: 0; top: 0; visibility: hidden; transition: 330ms; transform: scale(0.6); -webkit-transform: scale(0.6); -moz-transform: scale(0.6); opacity: 0; -moz-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -o-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); }
.farm-list li:hover:after { opacity: 0; transform: scale(1.3); -webkit-transform: scale(1.3); }
.farm-list li:hover:before { transform: scale(1); -webkit-transform: scale(1); opacity: 1; visibility: visible; }
.farm-list li a { display: block; position: relative; z-index: 5; }
.farm-list li strong { display: block; width: 70px; height: 56px; transition: 320ms; margin: auto; margin-bottom: 8px; }
.farm-list li span { display: block; text-align: center; line-height: 1; color: #505050; font-size: 14px; font-weight: bold; transition: 300ms; }
.farm-list li:hover span { color: #fff; }
.farm-list li:nth-child(1):hover strong { background: url(../images/farm1_1.png) center no-repeat; }
.farm-list li:nth-child(2):hover strong { background: url(../images/farm2_1.png) center no-repeat; }
.farm-list li:nth-child(3):hover strong { background: url(../images/farm3_1.png) center no-repeat; }
.farm-list li:nth-child(4):hover strong { background: url(../images/farm4_1.png) center no-repeat; }
.farm-list li:nth-child(5):hover strong { background: url(../images/farm5_1.png) center no-repeat; }

.farm-list li:nth-child(1) strong { background: url(../images/farm1.png) center no-repeat; }
.farm-list li:nth-child(2) strong { background: url(../images/farm2.png) center no-repeat; }
.farm-list li:nth-child(3) strong { background: url(../images/farm3.png) center no-repeat; }
.farm-list li:nth-child(4) strong { background: url(../images/farm4.png) center no-repeat; }
.farm-list li:nth-child(5) strong { background: url(../images/farm5.png) center no-repeat; }
.farm-list li:nth-child(1) { left: 50%; margin-left: -64px; top: -48px; }
.farm-list li:nth-child(2) { right: -52px; top: 107px; }
.farm-list li:nth-child(3) { right: 28px; bottom: -24px; }
.farm-list li:nth-child(4) { left: 28px; bottom: -24px; }
.farm-list li:nth-child(5) { left: -52px; top: 107px; }

.farm-box { padding: 70px 0 110px; position: relative; }
.farms { background: #fff; border-radius: 18px; position: relative; padding-top: 30px; }
.farmline { content: ""; width: 1px; height: 100%; background: #ddd3cb; position: absolute; left: 179px; top: 0; z-index: 0; }
.farm-flex { float: left; position: relative; top: 0; z-index: 3; }
.farm-flex.flex { position: fixed; left: 50%; margin-left: -500px; width: 1000px; top: 94px; transition: top 560ms 0ms; }
.farm-flex.farmabo { position:absolute; top:auto; bottom:0; margin-bottom:0; transition: 440ms 0ms bottom; }

.farms-ul li { margin-bottom: 3px; position: relative; width: 161px; padding: 13px 0 13px 18px; }
.farms-ul li a:before { content: ""; width: 100%; height: 100%; background: #505050; position: absolute; left: 0; top: 0; transform-origin: 100%; -webkit-transform-origin: 100%; -webkit-transition: -webkit-transform .34s cubic-bezier(.4,0,.2,1); transition: -webkit-transform .44s cubic-bezier(.4,0,.2,1); transition: transform .44s cubic-bezier(.4,0,.2,1); transition: transform .44s cubic-bezier(.4,0,.2,1),-webkit-transform .44s cubic-bezier(.4,0,.2,1); transform: scaleX(0); -webkit-transform: scaleX(0); }
.farms-ul li a:after { content: ""; width: 19px; height: 19px; background: url(../images/radius10.png) center no-repeat; position: absolute; right: -10px; top: 50%; margin-top: -10px; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transition: 288ms 0ms; opacity: 0; visibility: hidden; }

.farms-ul li:hover a:before, .farms-ul li.current a:before { transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transform-origin: 0; -webkit-transform-origin: 0; }
.farms-ul li:hover a:after, .farms-ul li.current a:after { opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); transition: 288ms 200ms; }
.farms-ul li strong { display: block; width: 52px; height: 52px; float: left; margin-right: 10px; background: url(../images/radius8.png) center no-repeat; transition: 300ms; text-align: center; position: relative; }
.farms-ul li strong img { display: block; width: 28px; height: auto; margin: auto; top: 13px; position: absolute; left: 14px; transition: 300ms; }
.farms-ul li strong img.hide { opacity: 0; visibility: hidden; }
.farms-ul li span { display: block; color: #505050; font-size: 14px; font-weight: bold; line-height: 52px; float: left; transition: 288ms; position: relative; }
.farms-ul li:hover strong, .farms-ul li.current strong { background: url(../images/radius9.png) center no-repeat; }
.farms-ul li:hover strong .show, .farms-ul li.current strong .show { opacity: 0; visibility: hidden; }
.farms-ul li:hover strong .hide, .farms-ul li.current strong .hide { opacity: 1; visibility: visible; }
.farms-ul li:hover span, .farms-ul li.current span { color: #fff; }

.farm-content { width: 710px; float: right; margin-right: 62px; padding-top: 25px; position: relative; z-index: 5; }
.farm-info { padding-bottom: 45px; margin-top: 20px; border-bottom: 1px dashed #d0c2ba; margin-bottom: 45px; }
.farm-ts { margin-bottom: 30px; }
.farm-ts h3 { color: #505050; font-size: 24px; text-align: center; line-height: 1; font-weight: normal; margin-bottom: 18px; }
.farm-ts p { color: #505050; font-size: 16px; text-align: left; }
.farm-img { text-align: center; }
.farm-img img { display: inline; max-width: 100%; height: auto; margin: auto; }
.farm-info:last-child { margin-bottom: 20px; border-bottom: none; }
.recipesb { position: relative; }
.recipesb { background-size: cover !important; }
.recpesbfix { background-size: cover !important; position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.farm-list { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.devote.article-block, .eventnew.article-block { transform: translateY(100px); -webkit-transform: translateY(100px); -moz-transform: translateY(100px); opacity: 0; visibility: hidden; transition: 880ms; }
.devote.articleShow, .eventnew.articleShow { opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); }

.pbannerfix.article-block { opacity: 0; visibility: hidden; transform: rotate(-180deg); transition: all .88s cubic-bezier(.785,.135,.15,.86); -webkit-transition: all .88s cubic-bezier(.785,.135,.15,.86); transform: translateY(120px); -webkit-transform: translateY(120px); -moz-transform: translateY(120px); }
.pbannerfix.articleShow { opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); }

.common-t.article-block { opacity: 0; visibility: hidden; transform: skewX(-45deg); transition: 560ms ease-in-out; }
.common-t.articleShow { opacity: 1; visibility: visible; transform: skewX(0deg); }
.intro-text.article-block, .brand-top.article-block, .story-tab.article-block, .honor-list.article-block, .sundat.article-block { opacity: 0; visibility: hidden; position: relative; top: 65px; transition: 540ms 120ms; }
.story-tab.article-block { transition: 540ms 220ms; }
.sundat.article-block { transition: 630ms 0ms; }
.intro-text.articleShow, .brand-top.articleShow, .story-tab.articleShow, .honor-list.articleShow, .sundat.articleShow { opacity: 1; visibility: visible; top: 0; }

.video-info.article-block, .farmtop.article-block { opacity: 0; position: relative; top: 68px; transition: 780ms 0ms; }
.video-info:nth-child(2).article-block { transition: 780ms 340ms; }
.video-info.articleShow, .farmtop.articleShow { opacity: 1; top: 0; }

.profile-text.article-block { transform: rotateY(-90deg); -webkit-transform: rotateY(-90deg); transform-origin: 50% 0; -webkit-transform-origin: 50% 0; transition: 860ms 120ms; -webkit-transition: 860ms 120ms; opacity: 0; }
.profile-text.articleShow { opacity: 1; transform: rotateY(0); -webkit-transform: rotateY(0); }

.farmborder.article-block .farm-list { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); opacity: 0; visibility: hidden; transition: 860ms 200ms; }
.farmborder.article-block .video-info { opacity: 0; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transition: 650ms 0ms; visibility: hidden; }
.farmborder.articleShow .farm-list { opacity: 1; visibility: visible; transform: rotate(0deg); -webkit-transform: rotate(0); -moz-transform: rotate(0deg); }
.farmborder.articleShow .video-info { opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); }


#proPage { position: fixed; top: 0; left: 0; right: 0px; bottom: 0px; z-index: 1006; background: rgba(0,0,0,0.5); background: #000\9; filter: alpha(opacity=50); overflow: hidden; -webkit-overflow-scrolling: touch; display: block; visibility: hidden; z-index: 1010; opacity: 0; transition: 560ms; }
.pro-bd { left: 50%; width: 50%; margin-left: -25%; border-radius: 18px; background: #fff; cursor: default; opacity: 0; transform: scale(0.9) translateY(100%); -webkit-transform: scale(0.9) translateY(100%); -moz-transform: scale(0.9) translateY(100%); position: fixed; top: 50%; visibility: hidden; z-index: 1020; }
.pro-page { padding: 40px 36px 38px; }
.closes { position: absolute; overflow: hidden; height: 32px; width: 32px; right: 32px; top: 32px; z-index: 1030; cursor: pointer; background-color: #B0000D; background: url(../images/close1.png) no-repeat scroll center center; transition: 480ms; }
.closes:hover { transform: rotate(180deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg); }
html.openPH body { -webkit-transition: all 0s; -moz-transition: all 0s; -ms-transition: all 0s; transition: all 0s; }
html.openPH #proPage { overflow-y: auto; width: 104%; left: -2%; }
html.openPH .introduct-mark { overflow-y: auto; }
html.openPH .introduct-mark .introduct-filex { top: 0; position: absolute; box-sizing: border-box; margin-top: 0 !important; }
html.openPH #proPage .pro-bd { top: 0; width: 50%; position: absolute; box-sizing: border-box; margin-top: 0 !important; }
.pro-page { position: relative; }
html.openPro #proPage { visibility: visible; opacity: 1; transition: 560ms; }
html.openPro .pro-bd { opacity: 1; transform: scale(1) translateY(0); transition: 650ms 150ms; -webkit-transition: 650ms 150ms; -webkit-transform: scale(1) translateY(0); -moz-transform: scale(1) translateY(0); visibility: visible; }
.introduct-fixs { margin: 22px auto 0px; }
.introduct-fixs p { color: #505050; font-size: 16px; }
.farm-ts img { max-width: 100%; display: inline-block; }

.onumBox{text-align:center;margin:20px 0;}
.onumBox a{display: inline-block;color: #766047;font-size: 18px;font-weight: bold;font-family: Arial;margin-right: 10px!important;width: 26px;height: 40px;line-height: 40px;text-align: center;vertical-align: middle;}
.onumBox a.next_page{
	width:40px;
	height:40px;
	background: url(../images/next2.png) center no-repeat;
    margin-right: 0!important;
    margin-left: 7px;
}
.onumBox a.prev_page{
	width:40px;
	height:40px;
	background: url(../images/prev2.png) center no-repeat;
    margin-right: 17px!important;
}
.onumBox a.current_page,.onumBox a:hover{color: #ee7133!important;}

.recipes-box.col-60{width:60%;}

@media screen and (max-width: 750px){
	.recipes-box.col-60{width:90%;}
}
@media screen and (min-width: 1200px){
	.recipes-box.col-60{width:700px;}
}
