@charset "utf-8";
html {font-size:100px; width:100%; height:100%; -webkit-text-size-adjust:100%; -moz-text-size-adjust:100%; -ms-text-size-adjust:100%; -o-text-size-adjust:100%; text-size-adjust:100%; }
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td,figure{ margin:0; padding:0; }
body,button,input,select,textarea { font-family:"Roboto-Light",Tahoma,Arial,sans-serif; font-size:62.5%; word-wrap:break-word; }
textarea {resize:none;}
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:normal; }
a,label{blr:expression_r(this.onFocus=this.blur());outline:none;}
address,cite,dfn,em,var{font-style:normal}
ul,ol{list-style:none}
fieldset,img{border:0;vertical-align:bottom;}
section,article,aside,header,footer,nav,dialog,figure{display:block;}
table{width:100%;border-collapse:collapse;border-spacing:0;}

.tranAll, a { transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; -ms-transition:all 0.3s ease; }
*,*:after,*:before { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box;  -o-box-sizing:border-box; box-sizing:border-box; }
*:after, *:before { display:block; }
*:focus { outline:none; }
.clear{display:block;height:0;overflow:hidden;clear:both}
.clearfix:after{content:'\20';display:block;height:0;clear:both}
.clearfix{*zoom:1}

input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus { outline:#8C6E49 solid thin; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color:rgba(244,225,198,0.7); }
input:-ms-input-placeholder, textarea:-ms-input-placeholder { color:rgba(244,225,198,0.7); }
input::-moz-placeholder, textarea::-moz-placeholder { color:rgba(244,225,198,0.7); }
input:-moz-placeholder, textarea:-moz-placeholder { color:rgba(244,225,198,0.7);}
input[type="checkbox"] { width:14px; height:14px; border:1px solid #ddd; background:#fff url(_blank); }

.hidden{display:none;}
.invisible{visibility:hidden;}
.noBg{background:none !important;}
.noBd{border:none !important;}

.cssTable { width:100%; height:100%; display:table; }
.cssTd { width:100%; height:100%; vertical-align:middle; display:table-cell; }

body { font-family:"arial","Microsoft Yahei"; color:#858585; margin:0 auto; background:#fff; overflow-x: hidden; }
input, textarea { font-family:"arial","Microsoft Yahei";/*  -webkit-appearance:none; */ }
a { color:#858585; text-decoration:none; }
a:hover { color:#BE9D84; text-decoration:none; }
img { vertical-align:bottom; }
.wrap { width:14.2rem; margin:0 auto; }
/*
display:-ms-flexbox; display:-webkit-box; display:-webkit-flex; display:flex;
margin:auoto
*/

/* fonts */
@font-face {
    font-family: 'Museo700Regular';
    src: url('../fonts/Museo700Regular.eot');
    src: url('../fonts/Museo700Regular.eot') format('embedded-opentype'),
         url('../fonts/Museo700Regular.woff2') format('woff2'),
         url('../fonts/Museo700Regular.woff') format('woff'),
         url('../fonts/Museo700Regular.ttf') format('truetype'),
         url('../fonts/Museo700Regular.svg#Museo700Regular') format('svg');
}

@font-face {
    font-family: 'Museo300Regular';
    src: url('../fonts/Museo300Regular.eot');
    src: url('../fonts/Museo300Regular.eot') format('embedded-opentype'),
         url('../fonts/Museo300Regular.woff2') format('woff2'),
         url('../fonts/Museo300Regular.woff') format('woff'),
         url('../fonts/Museo300Regular.ttf') format('truetype'),
         url('../fonts/Museo300Regular.svg#Museo300Regular') format('svg');
}
@font-face {
    font-family: 'Museo500Regular';
    src: url('../fonts/Museo500Regular.eot');
    src: url('../fonts/Museo500Regular.eot') format('embedded-opentype'),
         url('../fonts/Museo500Regular.woff2') format('woff2'),
         url('../fonts/Museo500Regular.woff') format('woff'),
         url('../fonts/Museo500Regular.ttf') format('truetype'),
         url('../fonts/Museo500Regular.svg#Museo500Regular') format('svg');
}
@font-face {
    font-family: 'ProximaNovaLight';
    src: url('../fonts/ProximaNovaLight.eot');
    src: url('../fonts/ProximaNovaLight.eot') format('embedded-opentype'),
         url('../fonts/ProximaNovaLight.woff2') format('woff2'),
         url('../fonts/ProximaNovaLight.woff') format('woff'),
         url('../fonts/ProximaNovaLight.ttf') format('truetype'),
         url('../fonts/ProximaNovaLight.svg#ProximaNovaLight') format('svg');
}

@font-face {
    font-family: 'ProximaNovaRegular';
    src: url('../fonts/ProximaNovaRegular.eot');
    src: url('../fonts/ProximaNovaRegular.eot') format('embedded-opentype'),
         url('../fonts/ProximaNovaRegular.woff2') format('woff2'),
         url('../fonts/ProximaNovaRegular.woff') format('woff'),
         url('../fonts/ProximaNovaRegular.ttf') format('truetype'),
         url('../fonts/ProximaNovaRegular.svg#ProximaNovaRegular') format('svg');
}
@font-face {
    font-family: 'ProximaNovaBold';
    src: url('../fonts/ProximaNovaBold.eot');
    src: url('../fonts/ProximaNovaBold.eot') format('embedded-opentype'),
         url('../fonts/ProximaNovaBold.woff2') format('woff2'),
         url('../fonts/ProximaNovaBold.woff') format('woff'),
         url('../fonts/ProximaNovaBold.ttf') format('truetype'),
         url('../fonts/ProximaNovaBold.svg#ProximaNovaBold') format('svg');
}



/* 控制页面鼠标滑到下面才触发动画 */
.view-in .view-out-list {
	opacity:0; filter:alpha(opacity=0);
	-webkit-transition:all 0s 0s !important;
	-moz-transition:all 0s 0s !important;
	-ms-transition:all 0s 0s !important;
	-o-transition:all 0s 0s !important;
	transition:all 0s 0s !important;
	-webkit-transform:translate(0,150px);
	-moz-transform:translate(0,150px);
	-ms-transform:translate(0,150px);
	-o-transform:translate(0,150px);
	transform:translate(0,150px);
}
.view-in .view-in-list {
	opacity:1; filter:alpha(opacity=100);
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	-ms-transition:all 1s;
	-o-transition:all 1s;
	transition:all 1s;
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	-o-transform:translate(0,0);
	transform:translate(0,0);
}


/* index */
.bodyContainer{ position:relative;
	background-size:cover !important;
	background-color:#8C6E49;
	-webkit-animation:conbgopacity 1s ease 0s backwards;
	-moz-animation:conbgopacity 1s ease 0s backwards;
	-ms-animation:conbgopacity 1s ease 0s backwards;
	-o-animation:conbgopacity 1s ease 0s backwards;
	animation:conbgopacity 1s ease 0s backwards;
}
.indexContainer {overflow:hidden;}


@-webkit-keyframes conbgopacity {
	0% { opacity:0; } 
	100% {opacity:1;}
}

@-moz-keyframes conbgopacity { 
	0% { opacity:0; } 
	100% {opacity:1;}
}

@-ms-keyframes conbgopacity {
	0% { opacity:0; } 
	100% {opacity:1;}
}

@-o-keyframes conbgopacity { 
	0% { opacity:0; } 
	100% {opacity:1;}
}
@keyframes conbgopacity { 
	0% { opacity:0; } 
	100% {opacity:1;}
}


.find-page .step2,
.find-page .step3 {
	margin-top: 0.6rem;
}

.btnMenu{ position:absolute; top:0.6rem; left:0.9rem; font-size:0.2rem; color:#fff; line-height:0.3rem; font-family:"Museo700Regular","Arial"; cursor:pointer; z-index:10; text-align:center;
	
	-webkit-animation:btnmenuimate 0.5s ease 1s backwards;
	-moz-animation:btnmenuimate 0.5s ease 1s backwards;
	-ms-animation:btnmenuimate 0.5s ease 1s backwards;
	-o-animation:btnmenuimate 0.5s ease 1s backwards;
	animation:btnmenuimate 0.5s ease 1s backwards;
}
.btnMenu.on{}

.btnMenu.on span{
	height: 0.13rem; 
}
.btnMenu.on span i{
	position:absolute; top:0; left:0;
}
.btnMenu.on span i:nth-of-type(1){
	transform: rotate(20deg);
    -ms-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -webkit-transform: rotate(20deg);
    -o-transform: rotate(20deg);
}
.btnMenu.on span i:nth-of-type(2){ opacity:0; }
.btnMenu.on span i:nth-of-type(3){ 
	transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
}

.btnMenu span{ display:block; width:0.6rem; margin:0 auto; position:relative; 
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.btnMenu span i{ display:block; width:100%; height:2px; background:#fff; margin-bottom:0.05rem; 
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.btnMenu.color{color:#8c6e49;}
.btnMenu.color span i{ background:#8c6e49;}

.btnOpenmenu{ position:fixed;}


.btnClosemenu{  font-family:"Museo500Regular","Arial"; }
.btnClosemenu span{ height:0.15rem;}
.btnClosemenu span i{ position:absolute; top:0; left:0; } 
.btnClosemenu span i:nth-of-type(1){
	 transform:rotate(20deg); 
	 -ms-transform:rotate(20deg);
	 -moz-transform:rotate(20deg);
	 -webkit-transform:rotate(20deg);
	 -o-transform:rotate(20deg);
}
.btnClosemenu span i:nth-of-type(2){
	 transform:rotate(-20deg); 
	 -ms-transform:rotate(-20deg);
	 -moz-transform:rotate(-20deg);
	 -webkit-transform:rotate(-20deg);
	 -o-transform:rotate(-20deg);
}


.logobox{padding:0.6rem 0 0.3rem;
}
.logobox a{display:block; margin:0 auto; width:4.65rem;  overflow:hidden;
}
.logobox a img{display:block; max-width:100%; margin:0 auto;
	
	position:relative;
	-webkit-animation:logoanimate 0.5s linear 1s backwards;
	-moz-animation:logoanimate 0.5s linear 1s backwards;
	-ms-animation:logoanimate 0.5s linear 1s backwards;
	-o-animation:logoanimate 0.5s linear 1s backwards;
	animation:logoanimate 0.5s linear 1s backwards;
}
.poslogobox{ position:absolute; left:50%; transform:translate(-50%,0); -webkit-transform:translate(-50%,0); -moz-transform:translate(-50%,0); -ms-transform:translate(-50%,0); -o-transform:translate(-50%,0); top:0;}

/* logo */
@-webkit-keyframes logoanimate {
	0% { top:-1rem; opacity:0;} 
	100% {top:0; opacity:1;}
}

@-moz-keyframes logoanimate { 
	0% { top:-1rem; opacity:0;} 
	100% {top:0; opacity:1;}
}

@-ms-keyframes logoanimate {
	0% { top:-1rem; opacity:0;} 
	100% {top:0; opacity:1;}
}

@-o-keyframes logoanimate { 
	0% { top:-1rem; opacity:0;} 
	100% {top:0; opacity:1;}
}
@keyframes logoanimate { 
	0% { top:-1rem; opacity:0;} 
	100% {top:0; opacity:1;}
}

/* btnmenu */
@-webkit-keyframes btnmenuimate {
	0% {opacity:0;} 
	100% {opacity:1;}
}

@-moz-keyframes btnmenuimate { 
	0% {opacity:0;} 
	100% {opacity:1;}
}

@-ms-keyframes btnmenuimate {
	0% {opacity:0;} 
	100% {opacity:1;}
}

@-o-keyframes btnmenuimate { 
	0% {opacity:0;} 
	100% {opacity:1;}
}
@keyframes btnmenuimate { 
	0% {opacity:0;} 
	100% {opacity:1;}
}


.cenSloganbox{ position:absolute; top:50%; left:50%; text-align:center; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); padding-top:2rem;}
.cenSloganbox img{ display:block; max-width:100%; margin:0 auto; }
/* .cenSloganbox .sloganTxt{width:9.91rem; margin:0 auto;}  */



.cenSloganbox .sloganTxt{ background:rgba(242,233,210,0.9); font-size:0.6rem; line-height:0.6rem; color:#8c6e49; font-family:"Museo300Regular","Arial"; padding:0.15rem 0.2rem; text-transform:uppercase; white-space: nowrap; overflow:hidden;
	-webkit-animation:bgopacity 1s ease 1s backwards;
	-moz-animation:bgopacity 1s ease 1s backwards;
	-ms-animation:bgopacity 1s ease 1s backwards;
	-o-animation:bgopacity 1s ease 1s backwards;
	animation:bgopacity 1s ease 1s backwards;
}
.cenSloganbox .sloganTxt .row{ display:inline-block;}
.cenSloganbox .sloganTxt h1{ display:block; padding:0.05rem 0.25rem; border:1px solid #8C6E4B; position:relative; z-index:2;
	-webkit-animation:txtopacity 1s ease 1s backwards;
	-moz-animation:txtopacity 1s ease 1s backwards;
	-ms-animation:txtopacity 1s ease 1s backwards;
	-o-animation:txtopacity 1s ease 1s backwards;
	animation:txtopacity 1s ease 1s backwards;
} 

.cenSloganbox .sloganTxt h1 span{position: relative;}
.cenSloganbox .sloganTxt h1 .span1{
	
	-webkit-animation:logoanimate 0.7s ease 1s backwards;
	-moz-animation:logoanimate 0.7s ease 1s backwards;
	-ms-animation:logoanimate 0.7s ease 1s backwards;
	-o-animation:logoanimate 0.7s ease 1s backwards;
	animation:logoanimate 0.7s ease 1s backwards;
	
}
.cenSloganbox .sloganTxt h1 .span2{
	-webkit-animation:txtanimate 0.7s ease 1s backwards;
	-moz-animation:txtanimate 0.7s ease 1s backwards;
	-ms-animation:txtanimate 0.7s ease 1s backwards;
	-o-animation:txtanimate 0.7s ease 1s backwards;
	animation:txtanimate 0.7s ease 1s backwards;
	
} 

.cenSloganbox .maptxt{ width:2.89rem; height:2.69rem; margin:0 auto; background-size:cover!important; font-family:"ProximaNovaLight","Arial"; font-size:0.24rem; line-height:0.36rem; color:#fff; position:relative; top:-0.4rem; text-transform:uppercase; padding-top:0.7rem; letter-spacing: 0.02rem;
	-webkit-animation:txtopacity 1s ease 1s backwards;
	-moz-animation:txtopacity 1s ease 1s backwards;
	-ms-animation:txtopacity 1s ease 1s backwards;
	-o-animation:txtopacity 1s ease 1s backwards;
	animation:txtopacity 1s ease 1s backwards;
} 

/* 首页中间部分背景opacity */
@-webkit-keyframes bgopacity {
	0% {background: rgba(242,233,210,0);} 
	100% {background: rgba(242,233,210,0.9);}
}

@-moz-keyframes bgopacity { 
	0% {background: rgba(242,233,210,0);} 
	100% {background: rgba(242,233,210,0.9);}
}

@-ms-keyframes bgopacity {
	0% {background: rgba(242,233,210,0);} 
	100% {background: rgba(242,233,210,0.9);}
}

@-o-keyframes bgopacity { 
	0% {background: rgba(242,233,210,0);} 
	100% {background: rgba(242,233,210,0.9);}
}
@keyframes bgopacity { 
	0% {background: rgba(242,233,210,0);} 
	100% {background: rgba(242,233,210,0.9);}
}


@-webkit-keyframes txtopacity {
	0% {opacity:0;} 
	100% {opacity:1;}
}

@-moz-keyframes txtopacity { 
	0% {opacity:0;} 
	100% {opacity:1;}
}

@-ms-keyframes txtopacity {
	0% {opacity:0;} 
	100% {opacity:1;}
}

@-o-keyframes txtopacity { 
	0% {opacity:0;} 
	100% {opacity:1;}
}
@keyframes txtopacity { 
	0% {opacity:0;} 
	100% {opacity:1;}
}



/* 首页中间部分文字由下向上滑入 */
@-webkit-keyframes txtanimate {
	0% { bottom:-1rem; } 
	100% {bottom:0;}
}

@-moz-keyframes txtanimate { 
	0% { bottom:-1rem; } 
	100% {bottom:0;}
}

@-ms-keyframes txtanimate {
	0% { bottom:-1rem; } 
	100% {bottom:0;}
}

@-o-keyframes txtanimate { 
	0% { bottom:-1rem; } 
	100% {bottom:0;}
}
@keyframes txtanimate { 
	0% { bottom:-1rem; } 
	100% {bottom:0;}
}

/* 侧边导航 */

.sideMenubox{ position:fixed; width:100%; height:100%; top:0; left:-100%; background:#F2E9D2; z-index:9; padding-bottom:0.7rem; 
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}
.sideMenubox.on{ left:0; }

.fromtxt{ text-align:center; font-size:0.24rem; line-height:0.3rem; color:#8c6e49; font-family:"Museo300Regular","Arial"; text-transform:uppercase; position:relative; 
}
.fromtxt h1{ display:inline-block; padding:0.05rem 0.2rem; border:1px solid #8C6E4B; margin:0.25rem 0; position:relative; position:relative;}

.fromtxt.on h1{
	-webkit-animation:txtform 0.6s ease 0.5s backwards;
	-moz-animation:txtform 0.6s ease 0.5s backwards;
	-ms-animation:txtform 0.6s ease 0.5s backwards;
	-o-animation:txtform 0.6s ease 0.5s backwards;
	animation:txtform 0.6s ease 0.5s backwards;
}
.fromtxt.on h1 p{
	position:relative;
	-webkit-animation:txtanimate 0.7s ease 0.6s backwards;
	-moz-animation:txtanimate 0.7s ease 0.6s backwards;
	-ms-animation:txtanimate 0.7s ease 0.6s backwards;
	-o-animation:txtanimate 0.7s ease 0.6s backwards;
	animation:txtanimate 0.7s ease 0.6s backwards;
}


/* sidemenu 头部 文字由下向上滑入 */
@-webkit-keyframes txtform {
	0% { bottom:-2rem; width: 5rem;} 
	100% {bottom:0; width: auto;}
}

@-moz-keyframes txtform { 
	0% { bottom:-2rem; width: 5rem;} 
	100% {bottom:0; width: 3.42rem;} 
}

@-ms-keyframes txtform {
	0% { bottom:-2rem; width: 5rem;} 
	100% {bottom:0; width: 3.42rem;}
}

@-o-keyframes txtform { 
	0% { bottom:-2rem; width: 5rem;} 
	100% {bottom:0; width: 3.42rem;}
}
@keyframes txtform { 
	0% { bottom:-2rem; width: 5rem;} 
	100% {bottom:0; width: 3.42rem;}
}



.menuListbox{ position:absolute;top:60%;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:80%; }
.menuListbox ul{ position:relative;}
.menuListbox ul.on{ 
	-webkit-animation:menulist 1s ease 0.5s backwards;
	-moz-animation:menulist 1s ease 0.5s backwards;
	-ms-animation:menulist 1s ease 0.5s backwards;
	-o-animation:menulist 1s ease 0.5s backwards;
	animation:menulist 1s ease 0.5s backwards;
}


/* sidemenu 导航list自左向右滑入 */
@-webkit-keyframes menulist {
	0% { left:-60%; } 
	100% {left:0; }
}

@-moz-keyframes menulist { 
	0% { left:-60%; } 
	100% {left:0; }
}

@-ms-keyframes menulist {
	0% { left:-60%; } 
	100% {left:0; }
}

@-o-keyframes menulist { 
	0% { left:-60%; } 
	100% {left:0; }
}
@keyframes menulist { 
	0% { left:-60%; } 
	100% {left:0; }
}

.menuListbox ul{display:block; }
.menuListbox ul li{display:block; float:left; width:33.3333%; padding:0.4rem 0;}
.menuListbox ul li a{ display:block;  font-size:0.6rem; line-height:0.6rem; color:#8c6e49; font-family:"Museo700Regular","Arial"; padding:0 20px; min-height:0.79rem; position:relative; text-align:center;}
.menuListbox ul li a .bgimg{
	position:absolute; top:0; left:50%; width:2.67rem; opacity:0;
	-webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}
.menuListbox ul li a .bgimg img{ display:block; max-width:100%; margin:0 auto;}
.menuListbox ul li a h1{ letter-spacing:0.03rem; position:relative; z-index:2; }
.menuListbox ul li a p{ font-family:"ProximaNovaLight","Arial"; font-size:0.2rem; line-height:0.3rem; text-align:center;color:#8c6e49; margin-top:0.3rem; opacity:0; letter-spacing: 0.01rem; position:relative; z-index:2; 
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.menuListbox ul li a:hover p,
.menuListbox ul li a.current p{
		opacity:1;
	-webkit-animation:ptxtani 0.3s linear 0s backwards;
	-moz-animation:ptxtani 0.3s linear 0s backwards;
	-ms-animation:ptxtani 0.3s linear 0s backwards;
	-o-animation:ptxtani 0.3s linear 0s backwards;
	animation:ptxtani 0.3s linear 0s backwards;
}
.menuListbox ul li a:hover .bgimg,
.menuListbox ul li a.current .bgimg{ opacity:1;}
/* .menuListbox ul li a:hover,
.menuListbox ul li a.current{ background:url(pic03.png) no-repeat top left; } */


/* sidemenu 导航鼠标浮动出现p */
@-webkit-keyframes ptxtani {
	0% { top:-0.5rem; } 
	100% {top:0; }
}

@-moz-keyframes ptxtani { 
	0% { top:-0.5rem; } 
	100% {top:0; }
}

@-ms-keyframes ptxtani {
	0% { top:-0.5rem; } 
	100% {top:0; }
}

@-o-keyframes ptxtani { 
	0% { top:-0.5rem; } 
	100% {top:0; }
}
@keyframes ptxtani { 
	0% { top:-0.5rem; } 
	100% {top:0; }
}

.footer{ text-align:center; font-size:0.14rem; line-height:0.24rem; color:#8c6e49; font-family:"ProximaNovaLight","Arial";  }
.footer{
		position: absolute;
		bottom: 0.2rem;
		left:0;
		width:100%; 
	}
.footer.on{
	-webkit-animation:footertxt 0.6s ease 0.5s backwards;
	-moz-animation:footertxt 0.6s ease 0.5s backwards;
	-ms-animation:footertxt 0.6s ease 0.5s backwards;
	-o-animation:footertxt 0.6s ease 0.5s backwards;
	animation:footertxt 0.6s ease 0.5s backwards;
}
.footer a{ display:inline-block; color:#8c6e49; text-decoration:underline;}
.footer a:hover{ font-weight:bold;}

@-webkit-keyframes footertxt {
	0% { bottom:-1rem; } 
	100% {bottom:0.2rem; }
}

@-moz-keyframes footertxt { 
	0% { bottom:-1rem; } 
	100% {bottom:0.2rem; }
}

@-ms-keyframes footertxt {
	0% { bottom:-1rem; } 
	100% {bottom:0.2rem; }
}

@-o-keyframes footertxt { 
	0% { bottom:-1rem; } 
	100% {bottom:0.2rem; }
}
@keyframes footertxt { 
	0% { bottom:-1rem; } 
	100% {bottom:0.2rem; }
}

/* about us */
.section{ background-size:cover!important; position:relative; }
#fp-nav.right{ right:0!important; z-index:7;}
#fp-nav ul li{ width:1rem; height:0.3rem; margin: 0.2rem 0;}
#fp-nav ul li a span{}
#fp-nav ul li a span.on{ background:#A1835D;}
#fp-nav ul li a.active span{ display:none;}

#fp-nav ul li a.active:before{  font-weight:bold; font-size:0.2rem; color:#fff;  font-family:"ProximaNovaLight","Arial";}
#fp-nav ul li:nth-of-type(1) a.active:before{ content:"01"; }
#fp-nav ul li:nth-of-type(2) a.active:before{ content:"02"; }
#fp-nav ul li:nth-of-type(3) a.active:before{ content:"03"; color:#A1835D;}

#fp-nav ul li a.active{ border-bottom:2px solid #fff; }
#fp-nav ul li:nth-of-type(3) a.active{ border-bottom:2px solid #A1835D;}

.secArticle{ position:relative;}

.section1.active .secArticle h1{
	/* -webkit-animation: topani 0.5s ease 1s backwards;
    -moz-animation: topani 0.5s ease 1s backwards;
    -ms-animation: topani 0.5s ease 1s backwards;
    -o-animation: topani 0.5s ease 1s backwards;
    animation: topani 0.5s ease 1s backwards; */
	
	-webkit-animation: bottomani 1s ease 1s backwards;
    -moz-animation: bottomani 1s ease 1s backwards;
    -ms-animation: bottomani 1s ease 1s backwards;
    -o-animation: bottomani 1s ease 1s backwards;
    animation: bottomani 1s ease 1s backwards;
}
.section1 .secArticle h1{ margin: 0.5rem 0; position:relative;
	
}
.secArticle h1 img{ width:5.63rem; margin:0 auto; display:block;  }

.secArticle article{ font-size:0.24rem; line-height:0.36rem;  font-family:"ProximaNovaRegular","Arial"; color:#fff; position:relative; }
.section1.active .secArticle article{
	/* -webkit-animation: topani 0.5s ease 1s backwards;
    -moz-animation: topani 0.5s ease 1s backwards;
    -ms-animation: topani 0.5s ease 1s backwards;
    -o-animation: topani 0.5s ease 1s backwards;
    animation: topani 0.5s ease 1s backwards; */
	-webkit-animation: bottomani 1s ease 1.5s backwards;
    -moz-animation: bottomani 1s ease 1.5s backwards;
    -ms-animation: bottomani 1s ease 1.5s backwards;
    -o-animation: bottomani 1s ease 1.5s backwards;
    animation: bottomani 1s ease 1.5s backwards;
}

.section1 .secArticle article{ width:10.7rem; margin:0.3rem auto; display:block;}


/* @-webkit-keyframes topani {
	0% { top:-1rem; opacity:0; } 
	100% {top:0; opacity:1;}
}

@-moz-keyframes topani { 
	0% { top:-1rem; opacity:0; } 
	100% {top:0; opacity:1;}
}

@-ms-keyframes topani {
	0% { top:-1rem; opacity:0; } 
	100% {top:0; opacity:1;}
}

@-o-keyframes topani { 
	0% { top:-1rem; opacity:0; } 
	100% {top:0; opacity:1;}
}
@keyframes topani { 
	0% { top:-1rem; opacity:0; } 
	100% {top:0; opacity:1;}
} */


.splitImg{ display:block; margin:0 auto; width:4.36rem; position:relative;}
.splitImg img{ display:block; max-width:100%; margin:0 auto;}

.section1.active .splitImg{ 
	-webkit-animation: bottomani 1s ease 2s backwards;
    -moz-animation: bottomani 1s ease 2s backwards;
    -ms-animation: bottomani 1s ease 2s backwards;
    -o-animation: bottomani 1s ease 2s backwards;
    animation: bottomani 1s ease 2s backwards;
}


@-webkit-keyframes bottomani {
	0% { bottom:-1rem; opacity:0; } 
	100% {bottom:0; opacity:1;}
}

@-moz-keyframes bottomani { 
	0% { bottom:-1rem; opacity:0; } 
	100% {bottom:0; opacity:1;}
}

@-ms-keyframes bottomani {
	0% { bottom:-1rem; opacity:0; } 
	100% {bottom:0; opacity:1;}
}

@-o-keyframes bottomani { 
	0% { bottom:-1rem; opacity:0; } 
	100% {bottom:0; opacity:1;}
}
@keyframes bottomani { 
	0% { bottom:-1rem; opacity:0; } 
	100% {bottom:0; opacity:1;}
}


.mapbox{position:relative; width:7.5rem; margin:0 auto; font-size:0.24rem; line-height:0.36rem; color:#e8e0d8;  font-family:"Museo700Regular","Arial"; }


.section1.active .mapbox{ 
	-webkit-animation: bottomani 1s ease 2.5s backwards;
    -moz-animation: bottomani 1s ease 2.5s backwards;
    -ms-animation: bottomani 1s ease 2.5s backwards;
    -o-animation: bottomani 1s ease 2.5s backwards;
    animation: bottomani 1s ease 2.5s backwards;
}

.mapbox .line{width:3.17rem; margin:0.3rem auto; position:relative;}
.mapbox .line img{  display:block; max-width:100%; margin:0 auto;}

.mapbox .line .dot{position:absolute; width:0.3rem; height:0.3rem;}
.mapbox .line .dot i{position:inherit; top:0; top:0; width:inherit; height:inherit; border-radius:50%; background:rgba(255,255,255,1);
	-webkit-animation:mapCircle 2s linear 2s infinite backwards;
	-moz-animation:mapCircle 2s linear 2s infinite backwards;
	-ms-animation:mapCircle 2s linear 2s infinite backwards;
	-o-animation:mapCircle 2s linear 2s infinite backwards;
	animation:mapCircle 2s linear 2s infinite backwards;
}
.mapbox .line .dot i:nth-of-type(1){
	-webkit-animation:mapCircle 2s linear 1s infinite backwards;
	-moz-animation:mapCircle 2s linear 1s infinite backwards;
	-ms-animation:mapCircle 2s linear 1s infinite backwards;
	-o-animation:mapCircle 2s linear 1s infinite backwards;
	animation:mapCircle 2s linear 1s infinite backwards;
}
.mapbox .line .dot i:nth-of-type(2){
	-webkit-animation:mapCircle 3s linear 1s infinite backwards;
	-moz-animation:mapCircle 3s linear 1s infinite backwards;
	-ms-animation:mapCircle 3s linear 1s infinite backwards;
	-o-animation:mapCircle 3s linear 1s infinite backwards;
	animation:mapCircle 3s linear 1s infinite backwards;
}

@-webkit-keyframes mapCircle {
	0% { -webkit-transform:scale(0,0); background:rgba(255,255,255,1); }
	50% { -webkit-transform:scale(0.5,0.5); background:rgba(255,255,255,0.5); }
	100% { -webkit-transform:scale(1,1); background:rgba(255,255,255,0);  }
}

@-moz-keyframes mapCircle {
	0% { -moz-transform:scale(0,0); background:rgba(255,255,255,,1); }
	50% { -moz-transform:scale(0.5,0.5); background:rgba(255,255,255,0.5); }
	100% { -moz-transform:scale(1,1); background:rgba(255,255,255,0);  }
}

@-ms-keyframes mapCircle {
	0% { -ms-transform:scale(0,0); background:rgba(255,255,255,1); }
	50% { -ms-transform:scale(0.5,0.5); background:rgba(255,255,255,0.5); }
	100% { -ms-transform:scale(1,1); background:rgba(255,255,255,0);  }
}

@-o-keyframes mapCircle {
	0% { -o-transform:scale(0,0); background:rgba(255,255,255,1); }
	50% { -o-transform:scale(0.5,0.5); background:rgba(255,255,255,0.5); }
	100% { -o-transform:scale(1,1); background:rgba(255,255,255,0);  }
}
@keyframes mapCircle {
	0% { transform:scale(0,0); background:rgba(255,255,255,1); }
	50% { transform:scale(0.5,0.5); background:rgba(255,255,255,0.5); }
	100% { transform:scale(1,1); background:rgba(255,255,255,0);  }
}

.mapbox .line .dot1{ right:-0.15rem; top:-0.15rem;}
.mapbox .line .dot2{ right: 1.65rem; top: 0.63rem;}
.mapbox .line .dot3{ right: 1.3rem; top: 0.95rem;}
.mapbox .line .dot4{ left: -0.15rem; top: 0.86rem;}
.mapbox .line .dot5{ left: 0.15rem; top: 1.31rem;}
.mapbox .line .dot6{ left: 0.86rem; bottom: 0.72rem;}
.mapbox .line .dot7{ left: 0.25rem; bottom: -0.15rem;}

.mapbox .line .dot .txt{position: absolute; white-space: nowrap; }

.mapbox .line .dot1 .txt,
.mapbox .line .dot3 .txt,
.mapbox .line .dot6 .txt{ left: 0.4rem; top: 0; }

.mapbox .line .dot2 .txt{ right: -0.4rem; top: -0.4rem; }

.mapbox .line .dot4 .txt,
.mapbox .line .dot5 .txt,
.mapbox .line .dot7 .txt{ right: 0.4rem; top: 0; }

.scrollbox{ position:absolute; right:0.3rem; bottom:0.1rem; font-size:0.18rem; color:#e8e0d8; line-height:0.3rem; font-family:"ProximaNovaRegular","Arial"; text-align:center; z-index:2;}
.scrollbox a{ display:block; color:#e8e0d8;}
.scrollbox a:hover{ color:#8C6E49;}
.scrollbox i{ display:block; }

.scrollDown{
	-webkit-animation: scrollDown 1.5s ease 0s infinite;
    -moz-animation: scrollDown 1.5s ease 0s infinite;
    -ms-animation: scrollDown 1.5s ease 0s infinite;
    -o-animation: scrollDown 1.5s ease 0s infinite;
    animation: scrollDown 1.5s ease 0s infinite;
}
.scrollTop{
	-webkit-animation: scrollTop 1.5s ease 0s infinite;
    -moz-animation: scrollTop 1.5s ease 0s infinite;
    -ms-animation: scrollTop 1.5s ease 0s infinite;
    -o-animation: scrollTop 1.5s ease 0s infinite;
    animation: scrollTop 1.5s ease 0s infinite;
}


@-webkit-keyframes scrollDown{
    0% { transform:translate(0, -0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, 0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}
@-moz-keyframes scrollDown{
    0% { transform:translate(0, -0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, 0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}
@-ms-keyframes scrollDown{
    0% { transform:translate(0, -0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, 0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}
@-o-keyframes scrollDown{
    0% { transform:translate(0, -0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, 0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}
@keyframes scrollDown{
    0% { transform:translate(0, -0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, 0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}



@-webkit-keyframes scrollTop{
    0% { transform:translate(0, 0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, -0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}
@-moz-keyframes scrollTop{
    0% { transform:translate(0, 0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, -0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}
@-ms-keyframes scrollTop{
    0% { transform:translate(0, 0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, -0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}
@-o-keyframes scrollTop{
    0% { transform:translate(0, 0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, -0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}
@keyframes scrollTop{
    0% { transform:translate(0, 0.3rem) scale(1, 1); opacity:0; filter:alpha(opacity=0); }
    50% { transform:translate(0, 0) scale(0.9, 0.9); opacity:1; filter:alpha(opacity=100); }
    100% { transform:translate(0, -0.1rem) scale(0.8, 0.8); opacity:0; filter:alpha(opacity=0); }
}




.section2 .secArticle{ position:relative; height:100%;}
.section2 .secArticle article{ 
	width: 45%;
    position: absolute;
    top: 50%;
    left: 37%;
	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	-o-transform: translate(0, -50%);
	transform: translate(0, -50%);
}
.section2.active .secArticle{
	-webkit-animation:leftani 1.5s ease 0.7s backwards;
	-moz-animation:leftani 1.5s ease 0.7s backwards;
	-ms-animation:leftani 1.5s ease 0.7s backwards;
	-o-animation:leftani 1.5s ease 0.7s backwards;
	animation:leftani 1.5s ease 0.7s backwards; 
	
}

@-webkit-keyframes leftani {
	0% { bottom:-2rem; opacity:0;} 
	70% { bottom:0; opacity:0.5;} 
	100% { bottom:0; opacity:1;}
}
@-moz-keyframes leftani {
	0% { bottom:-2rem; opacity:0;} 
	70% { bottom:0; opacity:0.5;} 
	100% { bottom:0; opacity:1;}
}

@-ms-keyframes leftani {
	0% { bottom:-2rem; opacity:0;} 
	70% { bottom:0; opacity:0.5;} 
	100% { bottom:0; opacity:1;}
}

@-o-keyframes leftani {
	0% { bottom:-2rem; opacity:0;} 
	70% { bottom:0; opacity:0.5;} 
	100% { bottom:0; opacity:1;}
}
@keyframes leftani {
	0% { bottom:-2rem; opacity:0;} 
	70% { bottom:0; opacity:0.5;} 
	100% { bottom:0; opacity:1;}
}
 

.section3 .secArticle{ position:relative; height:100%; }
.section3.active .secArticle{
	-webkit-animation:leftani 1s ease 0.7s backwards;
	-moz-animation:leftani 1s ease 0.7s backwards;
	-ms-animation:leftani 1s ease 0.7s backwards;
	-o-animation:leftani 1s ease 0.7s backwards;
	animation:leftani 1s ease 0.7s backwards; 
}

.section3 .secArticle article{ 
	width: 45%;
    position: absolute;
    top: 40%;
    left: 37%;
	color:#8c6e49;
	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	-o-transform: translate(0, -50%);
	transform: translate(0, -50%);
} 

.section3 .scrollbox{ color:#8c6e49;}
.section3 .scrollbox a{ color:#8c6e49;}

/* recipe */
.recipebox{overflow-x:hidden;}
.Conthirdbox{ }
.Conthirdbox .bigTitle{ width:75%; height:100%; float:left; }
.Conthirdbox .smalllist{width:25%; height:100%; float:left; position:absolute; right:0; top:0;
	-webkit-animation:listanimate 1s ease 0.5s backwards;
	-moz-animation:listanimate 1s ease 0.5s backwards;
	-ms-animation:listanimate 1s ease 0.5s backwards;
	-o-animation:listanimate 1s ease 0.5s backwards;
	animation:listanimate 1s ease 0.5s backwards;
	
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
} 
.Conthirdbox .smalllist.on{ right:-100%;}

@-webkit-keyframes listanimate {
	0% { right:-100%; } 
	100% { right:0;}
}
@-moz-keyframes listanimate {
	0% { right:-100%; } 
	100% { right:0;}
}

@-ms-keyframes listanimate {
	0% { right:-100%; } 
	100% { right:0;}
}

@-o-keyframes listanimate {
	0% { right:-100%; } 
	100% { right:0;}
}
@keyframes listanimate {
	0% { right:-100%; } 
	100% { right:0;}
}

.Conthirdbox .smalllist ul{ display:block; height:100%; }
.Conthirdbox .smalllist ul .outli{ float:left;  width:50%; height:100%; font-size:0.24rem; color:#fff; font-family:"Museo700Regular","Arial"; text-align:center; cursor:pointer; position:relative; overflow:hidden; position:relative;}
.Conthirdbox .smalllist ul .outli .bgimg{
	position:absolute; 
	top:0; left:0;
	width:100%; height:100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	-webkit-transition: transform 0.3s linear;
	-moz-transition: transform 0.3s linear;
	-ms-transition: transform 0.3s linear;
	-o-transition: transform 0.3s linear;
	transition: transform 0.3s linear;
}
.Conthirdbox .smalllist ul .outli .bgimg.bg17{
	background-image: url(pic17.jpg);
}
.Conthirdbox .smalllist ul .outli .bgimg.bg18{
	background-image: url(pic18.jpg);
}
.Conthirdbox .smalllist ul .outli:hover .bgimg{ 
	-webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-ms-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
	transform:scale(1.1,1.1);
}
.Conthirdbox .smalllist ul .outli .txt{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
}
.Conthirdbox .smalllist ul .outli .txt span{
	position: absolute;
	top: 50%;
	left: 50%;
	width: 200%;
	display: block;
	-webkit-transform:translate(-50%, -50%) rotate(-90deg);
	-moz-transform:translate(-50%, -50%) rotate(-90deg);
	-ms-transform:translate(-50%, -50%) rotate(-90deg);
	-o-transform:translate(-50%, -50%) rotate(-90deg);
	transform:translate(-50%, -50%) rotate(-90deg);
	text-transform:uppercase;
}
.Conthirdbox .smalllist ul .outli:first-child .txt{ background:rgba(140,110,75,0.5);}
.Conthirdbox .smalllist ul .outli:last-child .txt{ background:rgba(140,110,75,0.9);}

.Htit{display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);}
.Htit img{ display:block; margin:0 auto; max-width:100%;}
.recipebox .Htit{ width:3.68rem;} 

.popMainbox{ position:fixed; top:0; left:-100%; width:100%; height:100%; z-index:7; background:#fff;
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
	opacity:0;
}
.popMainbox.on{ left:0; opacity:1;}
.btnmainClose{ position:absolute; right:0.5rem; top:0.6rem; width:0.5rem; height:0.5rem; z-index:2;}
.btnmainClose i{ position:absolute; top:50%; left:0; width:100%; height:2px; background:#8C6E4B;}
.btnmainClose i:nth-of-type(1){
	 transform:rotate(45deg); 
	 -ms-transform:rotate(45deg);
	 -moz-transform:rotate(45deg);
	 -webkit--transform:rotate(45deg);
	 -o--transform:rotate(45deg);
}
.btnmainClose i:nth-of-type(2){
	 transform:rotate(-45deg); 
	 -ms-transform:rotate(-45deg);
	 -moz-transform:rotate(-45deg);
	 -webkit--transform:rotate(-45deg);
	 -o--transform:rotate(-45deg);
}

.popMainbox .leftimg{ width:38%; float:left; overflow:hidden; height:100%; background-size:cover; position:relative;}
.popMainbox .leftimg .img{ display:block; width:90%; position:absolute; left:0; bottom:0;}
.popMainbox .leftimg img{ display:block; max-width:100%; }


.popMainbox .rightContent{ width:62%; height:100%; overflow:hidden;  float:left; text-align:left; padding:0 1.2rem 0 0.6rem;
}
.popMainbox .rightContent .toptit{ text-transform:uppercase; padding:0.6rem 0; }
.rightContent .toptit h2{font-size:0.3rem; color:#8c6e49; line-height:0.36rem; font-family:"Museo300Regular","Arial";  }
.rightContent .toptit h1{font-size:0.7rem; color:#8c6e49; line-height:0.76rem; font-family:"Museo700Regular","Arial";  }

.popMainbox .rightContent .block{ font-size:0.18rem; line-height:0.3rem; color:#6a6a6a; font-family:"ProximaNovaRegular","Arial"; padding-bottom:0.4rem;}
.popMainbox .rightContent .block h3{ font-size:0.18rem; line-height:0.3rem; color:#6a6a6a; font-family:"ProximaNovaBold","Arial"; font-weight:bold;}

.Ingredientslist{}
.Ingredientslist ul{}

.Ingredientslist ul li{ float:left; width:33.3333%; padding: 0.2rem 0.5rem 0.2rem 0; text-align:center; } 
.Ingredientslist ul li .img{ position:relative; text-align:center; margin-bottom:0.3rem; } 
.Ingredientslist ul li .img:after{ content:"+"; font-size:0.4rem; color:#3B2002; right:-0.3rem; top:50%; position:absolute;}
.Ingredientslist ul li:last-child .img:after{ display:none;}

.Ingredientslist ul li .img img{
	max-width:100%;
	height: auto;
}

.commlistbox ul li{ float:left; text-align:center; cursor: auto;}
.commlistbox ul li .img{ margin:0.2rem auto 0.4rem; position:relative;} 
.commlistbox ul li .img img{ display:block; max-width:100%; position:absolute; top:0; left:50%; transform:translate(-50%,0); -webkit-transform:translate(-50%,0); -moz-transform:translate(-50%,0); -ms-transform:translate(-50%,0); -o-transform:translate(-50%,0);} 
.commlistbox ul li p{ padding:0.1rem 0;}

.popMainbox .rightContent .block article{ display:block; padding:0.1rem 0.15rem;}

/* productbox */
.productbox{overflow-x:hidden;}
.productbox .Htit{ width:4.88rem;}

.productbox .popMainbox{ background-size:cover!important;}
.popMainbox .block .tableimg{ width:100%;}
.popMainbox .block .tableimg img{display:block; max-width:100%; }

.popMainbox .block .row{}
.popMainbox .block .row span{font-family:"ProximaNovaBold","Arial";} 

.sharebox{margin:0.3rem 0;}
.sharebox a{ display:block; float:left; width:0.45rem; height:0.45rem; border-radius:50%; border:1px solid #909092; text-align:center; font-size:0.2rem; color:#656567; margin-right:0.25rem;}
.sharebox a i{ display:block; line-height:0.45rem;}
.sharebox a:hover{ border-color:#8C6E4B; color:#8C6E4B;}

.swipperbox,
.swipperbox ul,
.swipperbox ul li{ height:100%; width:100%; }

.Featureslist{}
.Featureslist ul{}
.Featureslist ul li{ float:left;width:20%;text-align:center; } 
.Featureslist-col4 ul li{ float:left;width:25%;text-align:center; }
.Featureslist ul li {padding:0.2rem 0;}
.Featureslist ul li .img {margin-bottom:0.3rem;}
.Featureslist ul li .img img { max-width:100%;height:auto;}
.Featureslist ul li a{ display:block; color:#6a6a6a;}
.Featureslist ul li a p{ padding:0;}

.Featureslist ul li a .viewmore{ 
	/* opacity:0; */
	display:block;
	text-decoration:underline;
	-webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
/* .Featureslist ul li a:hover .viewmore{ opacity:1;} */

.swipperbox .rightContent{ padding:0 0 0 0.6rem }
.swipper-procontent{ padding-right:1rem;}

.swiper-container-vertical>.swiper-pagination{
	right:0;
	width:0.7rem;
	top:25%;
} 
.swiper-pagination-bullet{ 
	position: relative;
    width: 100%;
    height: 0.3rem;
	line-height:0.3rem;
	margin-bottom:0.8rem!important;
	text-align:left;
	color:#6A6A6A;
	opacity:1;
	text-indent:-9999em;
	font-family:"ProximaNovaBold","Arial";
	font-size:0.2rem;
	background: none;
	border-radius: 0;
}
.swiper-pagination-bullet:before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	width: 0.1rem;
	height: 0.1rem;
	border-radius: 50%;
	border: 2px solid #6A6A6A;
    background: #AAABA7;
	margin-top: -0.05rem;
}
.swiper-pagination-bullet:last-child{ margin-bottom:0.1rem!important;}
.swiper-pagination-bullet-active{
	border-bottom:1px solid #6A6A6A;
	text-indent: 0;
}
.swiper-pagination-bullet-active:before{
	display: none;
}
.swiper-slide{ overflow:hidden;}
.swiper-slide-active{
	/*
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
	*/
}


.scrollbox.color{ color:#6a6a6a; }
.swiper-button-prev{ background:url(arrow_up.png) no-repeat center;}
.swiper-button-next{ background:url(arrow_down.png) no-repeat center;}
.swiper-button-next,
.swiper-button-prev{
	position:static; 
	width: 0.14rem;
    height: 0.35rem;
    display: block;
    margin: 0 auto;
}
.swiper-button-disabled{ opacity:0!important; display:none;}

/* gallery */
.gallerylistbox{ width:100%; background:#fff; position:absolute; bottom:0; left:0; padding:0.7rem 0 0.4rem;}
.gallerylistbox .gal-big { width:14.2rem; margin:0 auto;position:relative;}
.gallerylistbox .gal-big .gal-big-slider-prev,
.gallerylistbox .gal-big .gal-big-slider-next{ position: absolute; top:50%; width:16px;height:14px;margin-top:-0.32rem; cursor:pointer;-webkit-transform:translate(0, -50%);-moz-transform:translate(0, -50%);-ms-transform:translate(0, -50%);-o-transform:translate(0, -50%);transform:translate(0, -50%);}
.gallerylistbox .gal-big .gal-big-slider-prev{ left:-50px; background:url(arrow_left.png) no-repeat center;}
.gallerylistbox .gal-big .gal-big-slider-next{ right:-50px; background:url(arrow_right.png) no-repeat center; }
.gallerylistbox .gal-big-slider { width:100%; margin:0 auto;position:relative;}
.gallerylistbox .gal-big-slider .itemTxtbox{ display:block; padding:0.2rem 0; text-align:center; font-size:0.24rem; line-height:1em; color:#8c6e49; font-family:"Museo300Regular","Arial";}
.gallerylistbox .gal-big-slider li img {max-width: 100%;max-height:100%;width:auto;height:auto;}
.gallerylistbox .gal-small-slider{width:100%;}
.gallerylistbox .gal-small-slider.flex-viewport {width:100%;}
.gallerylistbox .gal-small-slider li a {display:block;text-align:center;}
.gallerylistbox .gal-small-slider li a img { max-width:100%;max-height:100%;}

/* gallery2 */
.gaItemlistpage{ background:#fff;}
.btnbackprev{ position:fixed; right:0.9rem; top:0.9rem; width:0.47rem; height:0.32rem; z-index:2;
	
	-webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
  }
.btnbackprev a{ display:block; }
.btnbackprev img{ display:block; max-width:100%;}

.btnbackprev:hover{ right:1rem;}

.left-bottom-txt{ position:fixed; left:4%; bottom:0.3rem; text-transform:uppercase;
	font-size: 0.48rem;
    line-height: 0.48rem;
    color: #8c6e49;
    font-family: "Museo300Regular","Arial";
	transform:rotate(-90deg); 
	-ms-transform:rotate(-90deg);
	-moz-transform:rotate(-90deg);
	-webkit-transform:rotate(-90deg);
	-o-transform:rotate(-90deg);
	transform-origin: left top; 
	-ms-transform-origin: left top;
	-moz-transform-origin: left top;
	-webkit-transform-origin: left top;
	-o-transform-origin: left top;
}
.left-bottom-txt p{  
}

.gaoutlistbox{padding:0.9rem 0 0.3rem;} 
.gaoutlistbox .wrap{  } 
.grid{  } 
.grid .grid-item{ float:left; margin:0.06rem; height:3.06rem; overflow:hidden;} 

.grid .grid-item .imgwrap{ position:relative;}
.grid .grid-item .imgwrap a{ display:block; position:relative;}
.grid .grid-item .imgwrap a img{ display:block; width:100%; }
.grid .grid-item .imgwrap .bgs {padding-top: 100%;background-repeat: no-repeat;background-position: center;background-size:cover;}


.grid-width1{ width:4.6rem;}
.grid-width2{ width:2.22rem;}

.grid-line{} 

.grid-mask{ position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(140,110,75,0.5); opacity:0;
	-webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.grid .grid-item .imgwrap a:hover .grid-mask{ opacity:1;}

.grid-mask i{ display:block; width:0.45rem; height:0.45rem; margin:0 auto;}
.grid-mask i img{ display:block; max-width:100%;}

.lb-data .lb-close{ position:absolute; right:-0.45rem; top:-0.45rem;}

/* 联系我们 */
.contactusbox{ position:relative; height:100%;}
.mapline-bg{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); width:6.75rem; 	-webkit-animation: btnmenuimate 0.5s ease 1s backwards;    -moz-animation: btnmenuimate 0.5s ease 1s backwards;    -ms-animation: btnmenuimate 0.5s ease 1s backwards;    -o-animation: btnmenuimate 0.5s ease 1s backwards;    animation: btnmenuimate 0.5s ease 1s backwards;}
.mapline-bg img{ display:block; max-width:100%; }
.mapline-bg .Htit{ top: 24%; left: 41%;}

.contactusbox .wrap{ position:relative;}
.blackRadius{ width:4.81rem; height:4.81rem; border-radius:50%; background:#000000; margin-top:1rem; text-align:center; font-size:0.18rem; line-height:0.3rem; color:#fff; font-family:"ProximaNovaRegular","Arial"; float:left; position:relative;	-webkit-animation:leftin 1s ease 1s backwards;	-moz-animation:leftin 1s ease 1s backwards;	-ms-animation:leftin 1s ease 1s backwards;	-o-animation:leftin 1s ease 1s backwards;	animation:leftin 1s ease 1s backwards;}@-webkit-keyframes leftin {	0% { left:-100%; opacity:0;} 	50% {left:0; opacity:0.3;}	100% {left:0; opacity:1;}}@-moz-keyframes leftin { 	0% { left:-100%; opacity:0;} 	50% {left:0; opacity:0.3;}	100% {left:0; opacity:1;}}@-ms-keyframes leftin {	0% { left:-100%; opacity:0;} 	50% {left:0; opacity:0.3;}	100% {left:0; opacity:1;}}@-o-keyframes leftin { 	0% { left:-100%; opacity:0;} 	50% {left:0; opacity:0.3;}	100% {left:0; opacity:1;}}@keyframes leftin { 	0% { left:-100%; opacity:0;} 	50% {left:0; opacity:0.3;}	100% {left:0; opacity:1;}}
.blackRadius h1{ font-family:"ProximaNovaBold","Arial"; }
.blackRadius .row{ margin-bottom:0.1rem;}

.contactform{ float:right; width:6.72rem; height:7.14rem; overflow:hidden;  position:relative; margin-top:0.7rem;	-webkit-animation:rightin 1s ease 1s backwards;	-moz-animation:rightin 1s ease 1s backwards;	-ms-animation:rightin 1s ease 1s backwards;	-o-animation:rightin 1s ease 1s backwards;	animation:rightin 1s ease 1s backwards;} @-webkit-keyframes rightin {	0% { right:-100%; opacity:0;} 	50% {right:0; opacity:0.3;}	100% {right:0; opacity:1;}}@-moz-keyframes rightin { 	0% { right:-100%; opacity:0;} 	50% {right:0; opacity:0.3;}	100% {right:0; opacity:1;}}@-ms-keyframes rightin {	0% { right:-100%; opacity:0;} 	50% {right:0; opacity:0.3;}	100% {right:0; opacity:1;}}@-o-keyframes rightin { 	0% { right:-100%; opacity:0;} 	50% {right:0; opacity:0.3;}	100% {right:0; opacity:1;}}@keyframes rightin { 	0% { right:-100%; opacity:0;} 	50% {right:0; opacity:0.3;}	100% {right:0; opacity:1;}}
.mainForm{ width:4.6rem; background:#A68457; padding:0.3rem; position:relative; z-index:2; margin:0 auto;} 
.contactform form{ display:block; margin-top:0.3rem;}
.formtit{ text-align:right; text-transform:uppercase; font-size:0.3rem; line-height:0.3rem; color:#fff; font-family:"ProximaNovaBold","Arial","Microsoft Yahei";  }

.input-text-box{ padding-bottom:0.2rem;}
.input-text-box:last-child{ padding-bottom:0;}
.input-text-box .half-input-text{ float:left; width:50%;} 
.input-text-box .half-input-text:nth-of-type(1){ padding-right:0.25rem;}
.input-text-box .half-input-text:nth-of-type(2){ padding-left:0.25rem;}

.input-text,
.textarea-text{ display:block; width:100%; height:0.4rem; line-height:0.3rem; padding:0.05rem 0.1rem; font-size:0.18rem; color:#fff; font-family:"ProximaNovaRegular","Arial","Microsoft Yahei"; border-style:none; border-style:none; border-bottom:1px solid #fff; background:none;}

.textarea-text{ height:1.6rem; resize:none;}

.button-submit{ display:block; width:1.16rem; height:0.4rem; border-style:none; background:none; text-align:center; border:1px solid #fff; font-size:0.18rem; line-height:0.4rem; color:#fff; font-family:"ProximaNovaRegular","Arial"; margin:0.2rem auto 0.1rem; cursor:pointer; border-radius:0.2rem;}
.button-submit:hover{ background:#8C6E49; border-color:#8C6E49;}

.bgform{ 
	width:100%; height:100%; background:url(bgform.png) no-repeat center; position:absolute; top:0; left:0; background-size:cover;
}
.promobconbox{
	
}
.tablelink{ }
.tablelink a{ 
	display:block;  
	font-size: 0.24rem;
    line-height: 0.3rem;
    color: #6a6a6a;
    font-family: "ProximaNovaBold","Arial";
    font-weight: bold;
	text-decoration:underline;
}


/* .find-page .find-steps canvas,
.find-page .find-steps2 canvas{ top:43.5%;} */


.gallerylistbox .Htit{ top:-1.5rem; width:4.36rem;} 
.btnSubmitbox p{ text-align:center; line-height:14px; font-size:14px; color:#F63A39; font-family: "Microsoft Yahei","Arial";} 
.btnSubmitbox p{display:none; }
.btnSubmitbox .text1.on{display:block;}
.btnSubmitbox .text2.on{display:block;}
.require.on{ border:1px solid #F63A39;}

.mobbox{ display:none;}
.remobimg{ width:100%; }
.remobimg img{ display:block;  max-width:80%;  }

.scrollBox {
    position: relative;
    overflow: hidden; 
	padding-right:0.2rem;
}
.recipebox .scrollBox{ max-height:100%;}
.popMainbox .scrollBox2{ max-height:100%;}
.ps-container .ps-scrollbar-x{
	display:none;
}
.ps-container .ps-scrollbar-y{
	background-color:rgba(140,110,73,0.5)!important;
	width: 4px!important;
	opacity:0;
	transition:all 1s ease;
	-webkit-transition:all 1s ease;
	-moz-transition:all 1s ease;
	-ms-transition:all 1s ease;
	-o-transition:all 1s ease;
}
.ps-container:hover .ps-scrollbar-y{ opacity:1;}


.gaoutlistbox .mobbox{ display:none;}
.find-page .step5 .backTop{ display:none;}


.new-share {
	position: absolute;
	right: 0.2rem;
	bottom: 0;
	z-index: 4;
}
.new-share a {
	float: left;
	margin-left: 0.1rem;
	width: 0.5rem;
	height: 0.5rem;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 50%;
}
.new-share a:hover {
	background-color: #fff;
}
.new-share .facebook {
	background-image: url(share-facebook.png);
}
.new-share .twitter {
	background-image: url(share-twitter.png);
}

/* 响应式 */

@media screen and (min-height:800px){
	.contactform {
		margin-top: 1.15rem;
	}
	
}


.find-page .step5 .article {
	height: auto;
}
.find-page .step5 .address {
	height: auto;
}
.find-page .step5 .address article {
	font-family: "ProximaNovaRegular", "Microsoft Yahei", "STHeiti Light";
    font-size: 0.18rem;
    line-height: 1.4em;
    color: #fff;
}


@media screen and (max-width:1730px){
	html{ font-size:90px;}
	.gaoutlistbox .wrap{ width:12rem;}
	.grid-width1{ width:3.85rem;}
	.grid-width2{ width:1.86rem;}
	.grid .grid-item{ height:2.56rem;}
}

@media screen and (max-width:1680px){
	
	html{ font-size:85px;}
	
	.secArticle h1 img { width:4.3rem;}
	.secArticle article {font-size: 0.2rem;}
	.mapbox {font-size:0.18rem;}
	.section1 .secArticle h1 {margin:0.3rem 0;}
	.rightContent .toptit h1 {font-size:0.5rem;}
	.popMainbox .leftimg {width:30%;}
	.popMainbox .rightContent {width:70%;}
	.popMainbox .rightContent .toptit {padding:0.45rem 0;}
}
@media screen and (max-width:1540px){
	
	html{ font-size:85px;}
}
@media screen and (max-width:1500px){
	.gallerylistbox .Htit { width: 3rem; top:-1rem;}
	.gaoutlistbox .wrap{ width:10.5rem;}
	.grid-width1 { width: 3.35rem; }
	.grid-width2{ width:1.62rem;}
	.grid .grid-item{ height:2.23rem;}
	.gallerylistbox .gal-big{ width:100%; padding: 0 0.5rem; }
	.gallerylistbox .gal-big .gal-big-slider-prev {left: 0.1rem;}
	.gallerylistbox .gal-big .gal-big-slider-next {right: 0.1rem;}
	
	
	.find-page .step2 .address h2 {
		left: 0.5rem;
		top: 0.4rem;
	}
	.find-page .step2 .address .circle-ani {
		left: 0.6rem;
		top: 0.8rem;
	}
}
@media screen and (max-width:1440px){
	html{ font-size:80px;}
	.blackRadius{ margin-top:2rem; font-size: 0.22rem;}
	.contactform{ margin-top:2.4rem;}
	.logobox { padding: 0.4rem 0 0.3rem; }
	.menuListbox {margin-top: 0rem; }
	
	.mapbox{ margin:0.5rem auto 0;}
	
	.lb-data .lb-close{ width:0.3rem!important; height:0.3rem!important; right:-0.25rem; top:-0.25rem;}
	
	
	.find-page .step5 .article{ width:20%;margin-right:25%;height: auto;}
	.find-page .step5 .article article{ font-size: 0.16rem;}
	.find-page .step5 .address article{ font-size: 0.16rem;}

	.find-page .step5 .address {
		width: 20%;
		margin-left: 25%;
	}
	
	.contactusbox .wrap{ width:100%;}
	.mapline-bg{ margin-top:-0.3rem;}
	.mapline-bg .Htit {
		top: 15%;
		left: 41%;
		width: 3rem;
	}
	.blackRadius{ margin-top:1rem;}
	.contactform {
		margin-top: 1rem;
		width: 6rem;
	}
}

@media screen and (max-width:1366px){
	.contactform {
		margin-top: 0.75rem;
	}
	.mapbox {
		margin: 0.5rem auto 0;
	}
	
	.btnMenu{ left:0.3rem;}
	.btnbackprev{ right:0.3rem;}
	.left-bottom-txt{ left:3%;}
	
	.mainForm {
		margin-right: 0.2rem;
	}
	.mapline-bg {
		text-align: center;
	}
	.mapline-bg img {
		max-width: 80%;
		max-height: 80%;
		margin: 0 auto;
	}
	.mapline-bg .Htit {
		left: 50%;
		width: 2.4rem;
	}
	
	.menuListbox{ margin:0 auto;}
	.menuListbox ul li{ padding:0.1rem 0;}
	.menuListbox ul li a{ font-size:0.3rem;}
	
	.popMainbox .rightContent .toptit{ padding:0.3rem 0;}
	.commlistbox ul li .img { margin: 0.2rem auto 0.1rem;}
	
	.popMainbox .rightContent .toptit {  padding: 0.3rem 1.2rem 0.3rem 0; }
	.rightContent .toptit h1{ font-size:0.5rem;}
	
	.gallerylistbox .Htit {
		top: -0.5rem;
		width: 2rem;
	}
	.gallerylistbox{ padding:0.3rem 0 0.15rem;}
	
	.blackRadius{ width: 3.6rem; height: 3.6rem; font-size:0.18rem; margin-left:0.2rem;}
	.contactform {margin-top:0;height:auto;}
	.mapline-bg{ margin-top:0;}
	
	.find-page .step5 .article h2{line-height:1em;}
	.find-page .step5 .article article{ font-size:0.14rem;}
	.find-page .step5 .address article{ font-size:0.14rem;}
	.find-page .step5 .copy {font-size: 0.16rem;}
	.find-page .step5 .address {height:auto;}
	.find-page .step5 .address .list {position:static;}
	.find-page .list {font-size:0.16rem;}
	
	.find-page .find-steps2 canvas,
	.find-page .find-steps canvas{ width:10rem;}
	
	.section1 .secArticle h1{ margin:0.2rem 0;}
	.secArticle h1 img{ width:4rem;}
	.section1 .secArticle article{ margin:0.1rem auto;}
	.splitImg{ width:3rem;}
}
@media screen and (min-width:1250px) and (max-height:768px){
	.btnMenu {top:0.4rem;}
	.logobox {padding: 0.3rem 0;}
	.logobox a {width:3rem;}
	.secArticle h1 img {width: 2rem;}
	.mapbox .line {-webkit-transform:scale(0.8, 0.8);-moz-transform:scale(0.8, 0.8);-ms-transform:scale(0.8, 0.8);-o-transform:scale(0.8, 0.8);transform:scale(0.8, 0.8);}
	.recipebox .Htit {width:2.6rem;}
	.productbox .Htit {width:3.6rem;}
	.popMainbox .leftimg {width:30%;}
	.popMainbox .rightContent {width:70%;}
	.rightContent .toptit h1 {font-size:0.3rem;line-height:1em;}
	.rightContent .toptit h2 {font-size:0.24rem;}
	.popMainbox .rightContent .block {line-height:1.4em;}
	.popMainbox .rightContent .block article{padding:0.1rem 0;padding-bottom:0.2rem;}
	.Featureslist {font-size:0.14rem;}
	.Featureslist ul li .img {padding: 0 20%;}
	.btnmainClose{top:0.4rem;right:0.3rem;}
	.popMainbox .rightContent .block {font-size:0.15rem; line-height:1.6em;}
}

@media screen and (max-width:1280px){
	.logobox {padding:0.3rem 0;}
	.logobox a {width: 3rem;}
	
	.btnMenu{ top:0.4rem;}
	.find-page .logo{ top:0.2rem;}
	.btnMenu span{ width:0.4rem;}
	.btnMenu { 
		font-size: 12px;
		line-height: 16px;
	}
	.btnbackprev{ width:0.36rem; top:0.3rem;} 
	.left-bottom-txt {
		font-size: 0.35rem;
		line-height: 0.35rem;
	}
	.wrap{ width:100%; }
	
/* 	.find-page .find-steps canvas, .find-page .find-steps2 canvas {
		top: 41.5%;
	} */
	
	.find-page .step2,
	.find-page .step3 {
		margin-top: 0;
	}
	.find-page .step2 .address h2 {
		left: 0.5rem;
		top: 0.2rem;
	}
	.find-page .step2 .address .circle-ani {
		left: 0.4rem;
		top: 0.6rem;
	}
	.find-page .step5 .address{ top:50%;}
	.find-page .find-steps canvas,
	.find-page .find-steps2 canvas{ margin-top:0;}
	
	
	.secArticle h1 img { width: 3rem;}
	.popMainbox .rightContent .block {font-size:0.15rem; line-height:1.6em;}
	
	.new-share a { width: 0.4rem;height:0.4rem;}
}

@media screen and (max-width:1200px){
	.gaoutlistbox .wrap{ width:9rem;}
	.grid-width1{ width:2.85rem;}
	.grid-width2{ width:1.38rem;}
	.grid .grid-item{ height:1.9rem;} 
	
}
@media screen and (max-width:1100px){
	.section1.active .secArticle article{
		width:90%;
		margin:0.2rem auto;
	}
	#fp-nav ul li{
		width:0.5rem;
	}
	#fp-nav ul li a.active:before{
		font-size:12px;
	}
	#fp-nav ul li{
		height:18px;
	}
	.section1 .secArticle h1{
		margin:0;
	}
	.secArticle h1 img{ width:4.2rem;}
	.mapbox .line{ margin:0 auto;}
	.splitImg{ width:3rem;}
	/*.menuListbox{ margin:0.3rem 0;}*/
	.menuListbox ul li{
		padding:0 0 0.2rem;
	}
	.section2 .secArticle,
	.section3 .secArticle{
		height:100%;
	}
	.section2 .secArticle article,
	.section3 .secArticle article { 
		left: 50%;
		transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%);
		-moz-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
		-o-transform: translate(-50%,-50%);
		width: 80%;
	}
	.Featureslist ul li .img{padding:0 10%;}
	
	.blackRadius { 
		width: 4rem;
		height: 4rem;
		margin-top: 1.8rem;
		margin-left:0.15rem;
	}
	.contactform { 
		width: 4rem;
		margin-right: 0.3rem;
	}
	.contactform {
    margin-top: 1rem;
    width: 5rem;
    width: 4.5rem;
    margin-right: 0.15rem;
	}
	.mainForm{ width:100%; padding: 0.2rem 0.15rem; box-shadow: 5px 5px 10px #a17c4a;}
	.bgform{ display:none;}
	
	
	
}
@media screen and (max-width:1024px){
	
	.menuListbox ul li a{ font-size:0.3rem;}

	.Conthirdbox .smalllist ul .outli {
		font-size: 0.2rem;
	}
	.rightContent .toptit h1{ font-size:0.4rem; line-height: 0.46rem;}
	.popMainbox .rightContent{ height:100%;}
	.popMainbox .rightContent .toptit{ padding:0.3rem 0;}
	.gaoutlistbox{ padding:0.5rem 0.8rem 0.3rem;} 
	.menuListbox {
		width: 90%;
		margin: 0 auto;
	}
	.find-page .step5 .article h2{ font-size:0.18rem;}
	.find-page .step5 .article article{ font-size:0.16rem;}
	.find-page .step5 .address article{ font-size:0.16rem;}
	.find-page .step5 .copy{ font-size:0.16rem;}
	
	
	.find-page .find-steps canvas,
	.find-page .find-steps2 canvas{ margin-top:-0.1rem;}
} 

@media screen and (max-width:1000px){
	.gaoutlistbox .wrap{ width:100%;} 
} 
.tablelink-img {display:none;}
@media screen and (max-width:960px){
	.tablelink-img {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: #fff;
		z-index: 99999;
		text-align: center;
	}
	.tablelink-img .tablelink-close {
		position: absolute;
		right: 0.15rem;
		top: 0.15rem;
		width: 0.45rem;
		height: 0.45rem;
		background: url(close.png) no-repeat center;
		background-size: 100% 100%;
		display: block;
	}
	.tablelink-img .iii img {
		max-width: 100%;
		max-height: 100%;
		width: auto;
		height: auto;
	}
	html{ font-size:100px;}
	.cenSloganbox .sloganTxt .row{ display:block;}
	.logobox a{ width:3rem;}
	.logobox{ padding:0.3rem 0;}
	.btnMenu{ top:0.3rem; left:0.1rem; font-size:0.14rem;}
	
	.menuListbox{
		width: 100%;
		padding-left: 0;
		text-align: center;
		margin:0 auto;
	}
	.menuListbox ul li { 
		width: 100%;
		float: none;
		padding: 0;
	}
	.menuListbox ul li a{
		padding-right:0;
		padding-left:0;
	}
	.menuListbox ul li a p{
		text-align:center;
	}
	.sideMenubox{
		padding-bottom:0.5rem;
	}
	
	.productbox .Htit,
	.recipebox .Htit {
		top: 30%;
	}
	.productbox {
		background-size: auto 72% !important;
		background-position: center top !important;
	}
	.recipebox {
		position: relative;
		background: #000 !important;
	}
	.recipebox:before {
		content: '';
		display: block;
		position: absolute;
		bottom: 30%;
		left: 0;
		right: 0;
		height: 70%;
		background-image: url(pic07-mobile.jpg);
		background-size: 100% auto;
		background-position: center bottom;
		background-repeat: no-repeat;
	}
	.Conthirdbox .smalllist{
		right: auto;
		width: 100%;
		height: 30%;
		bottom: 0;
		left: 0;
		top: auto;
		-webkit-animation: none;
		-moz-animation: none;
		-ms-animation: none;
		-o-animation: none;
		animation: none;
	}
	.Conthirdbox .smalllist ul .outli{
		width:100%; 
		float:none;
		height:50%;
	}
	.Conthirdbox .smalllist ul .outli .txt span {
		text-transform: uppercase;
		transform: translate(-50%, -50%) rotate(0);
		-ms-transform: translate(-50%, -50%) rotate(0);
		-moz-transform: translate(-50%, -50%) rotate(0);
		-webkit-transform: translate(-50%, -50%) rotate(0);
	}
	
	@-webkit-keyframes listanimate {
		0% { bottom:-100%; right:auto; } 
		100% { bottom:0;}
	}
	@-moz-keyframes listanimate {
		0% { bottom:-100%;  right:auto;} 
		100% { bottom:0;}
	}

	@-ms-keyframes listanimate {
		0% { bottom:-100%; right:auto; } 
		100% { bottom:0;}
	}

	@-o-keyframes listanimate {
		0% { bottom:-100%; right:auto; } 
		100% { bottom:0;}
	}
	@keyframes listanimate {
		0% { bottom:-100%;  right:auto;} 
		100% { bottom:0;}
	}
	.Conthirdbox .bigTitle{
		width:100%;
		float:none;
	}
	.bodyContainer{ overflow:hidden;}
	.popMainbox .leftimg{
		display:none;
	}
	.popMainbox .rightContent{
		float: none;
		width: 100%;
		position: relative;
		z-index: 2;
	}
	.btnmainClose{ z-index:3; right: 0.1rem; top: 0.2rem;  width: 0.35rem; height: 0.35rem;}
	
	.popMainbox{ overflow-y:scroll;}
	.mobbox{ display:block;}
	.popMainbox .rightContent{ padding:0;}
	.popMainbox .rightContent .toptit {
		padding: 0.3rem 0.6rem;
		text-align: center;
	}
	.popMainbox .rightContent .block{ padding:0 0.25rem 0.3rem;}
	.popMainbox .rightContent .block h3{
		font-size: 0.24rem;
	}
	.popMainbox .rightContent .specialblock h3{
		text-align: center;
		padding-bottom: 0.2rem;
		padding-top:0.2rem;
	}
	.commlistbox ul li{
		width:100%; 
		float:none; 
		padding-right:0;
		position:relative;
		padding-bottom: 0.6rem;
	}
	.commlistbox ul li:last-child{ padding-bottom:0.2rem;}
	.Ingredientslist ul li:after{
		content: "+";
		font-size: 0.4rem;
		color: #3B2002; 
		position: absolute; 
		bottom: 0.2rem;
		left: 50%;
		transform: translate(-50%,0);
		-webkit-transform: translate(-50%,0);
		-moz-transform: translate(-50%,0);
		-ms-transform: translate(-50%,0);
		-o-transform: translate(-50%,0);
	}
	.Ingredientslist ul li:last-child:after{ display:none;}
	.commlistbox ul li .img{
		height:auto;
		margin: 0.2rem auto;
	}
	.commlistbox ul li .img img{
		position:static;
		margin:0 auto; 
		transform: translate(0,0);
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-o-transform: translate(0,0);
	}
	.Ingredientslist ul li .img:after{
		display:none;
	}
	.popMainbox .rightContent{height:auto;}
	.swipper-procontent{display:none;}
	.productbox .popMainbox { 
		background: #fff!important;
	} 
	.Featureslist ul li{ 
		width: 50%;
		display: block;
		padding-bottom: 0.2rem;
	}
	.Featureslist ul li:nth-of-type(even):after{
		content:'\20';
		display:block;
		height:0;
		clear:both;
	}
	.Featureslist ul li .tt {
		height: 6.4em;
	}
	.blackRadius,
	.contactform{ float:none; margin:0.5rem auto;}
	.contactform{ height:auto;}
	.mapline-bg {
		margin-top: -2.3rem;
	}
	
	.blackRadius{ margin-top:2rem;}
	
/* 	.find-page .find-steps2,
	.find-page .find-steps3,
	.find-page .find-steps3 #find-canvas3,
	.find-page .find-steps,
	.find-page .step5{ height:8rem; width:100%;} */
	
	.find-page{ height:100%; overflow-y:scroll;}
	.find-page .step5 .article.active{ display:none;}
	
	.findmobbox{ padding:0.2rem 0.3rem 0.5rem; background:#fff;}
	.findmobbox h2{ text-align:center; font-size: 0.4rem; color: #8c6e49; line-height: 0.46rem; font-family: "Museo700Regular","Arial"; padding:0.2rem 0;}
	.findmobbox article{
		font-size: 0.18rem;
		line-height: 0.3rem;
		color: #6a6a6a;
		font-family: "ProximaNovaRegular","Arial";
	}
	.findmobbox article p{ padding-bottom:0.1rem;}
	body{ overflow-y:auto; }
	
	.find-page .step5 .address { 
		top: auto;
		margin-left: 0;
		bottom: 0.2rem;
		height: auto;
		display: none;
	}
	.find-page .list h2,
	.find-page .list p{ display:inline-block;}
	.find-page .step5 .address .list li{ padding-top:0;}
	.find-page .step5 .address.active {
		-webkit-transform: translate(-50%, 0);
		-moz-transform: translate(-50%, 0);
		-ms-transform: translate(-50%, 0);
		-o-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	.find-page .find-steps2 canvas{ margin-top:-0.2rem;}
	.find-page .find-steps canvas{ margin-top:-0.2rem;}
	
	
	
	.find-page .logo{}
	.find-page .logo a{ display:block; width:3.5rem; margin:0 auto; }
	.find-page .logo a img{ display:block; max-width:100%; }
	.find-page .step5 .backTop{ display:none;}
	
	
	.find-page .step5 .copy{ margin-bottom:1.3rem;}
	.find-page .step3,
	.find-page .step2{ width:100%!important;}
	.btnmainClose{ position:fixed;}
	.pcbox{ display:none;}
	
	.lb-data .lb-close{ display:none!important;}
	.lb-nav a.lb-prev,.lb-nav a.lb-next{ background:none!important;}
	
	.find-page{ position:relative;}
	
	.find-page .step2 .address{
		margin-top: -0.3rem;
		margin-left: -0.1rem;
	}
	.mapline-bg .Htit {
		top: 10%;
	}
	.new-share { position: static; text-align:center;}
	.new-share a { float:none;display:inline-block;margin:0 0.05rem; width: 0.3rem;height:0.3rem;}
}

@media screen and (max-width:920px){ 
	.gaoutlistbox .pcbox{ display:none;}
	.gaoutlistbox .mobbox{ display:block; margin:0.3rem 0 0.2rem;}
	
	.grid .grid-item{ width:33.3333%; height:auto; margin:0; padding:0.02rem;}
}

@media screen and (max-width:768px){
	.menuListbox {top:55%;}
}
@media screen and (max-width:600px){
	.menuListbox {top:50%;}
	.menuListbox ul li a .bgimg,
	.menuListbox ul li a p {display:none;}
	.menuListbox ul li a {font-size:0.4rem;line-height:1rem;}
	.grid .grid-item{ width:50%; }
	.left-bottom-txt{
		left: auto;
		position: static;
		transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		height: auto;
		padding: 0.3rem 70px 0;
	}
	.gaoutlistbox {
		padding: 0.3rem 0.2rem;
	}
	.btnMenu span{ width:40px;}
	.mapbox .line .dot1 .txt{ 
		left: auto;
		top: -0.3rem;
		right: 0;
	}
	.mapbox {
		margin: 0.8rem auto 0;
	} 
	.gallerylistbox{ padding:0.2rem 0 0;}
	
	.btnMenu{ left:0.25rem;}
	.find-page .step3 .address {bottom: 0.8rem;}
	.gallerylistbox .Htit {top:-2rem;width:3rem;}
}


@media screen and (max-width:475px){
	.find-page .find-steps canvas,
	.find-page .find-steps2 canvas {
		width: 150%;
		max-width: 150%;
	}
	.grid .grid-item {
		width: 50%;
	}
	.grid .grid-item .imgwrap {
		opacity: 1 !important;
		filter: alpha(opacity=100);
		-webkit-transform: translate(0,0) !important;
		-moz-transform: translate(0,0) !important;
		-ms-transform: translate(0,0) !important;
		-o-transform: translate(0,0) !important;
		transform: translate(0,0) !important;
	}
}
@media screen and (max-width:414px){
	
	.contactform{ width:90%;}
	.blackRadius{ width:5rem; height:5rem;}
	.mapline-bg {
		margin-top: -190px;
	}
	.btnMenu span{ width:30px;}
	.input-text, .textarea-text{
		height: 35px;
		font-size: 14px;
	}
	.button-submit{
		font-size: 14px;
		width: 100px;
		height: 30px;
		border-radius: 20px;
	}
	.mainForm{
		padding:0.4rem 0.15rem;
	}
	.btnMenu{ font-size:12px;}
	.mapline-bg .Htit {
		top: 10%;
		left: 50%;
	}
}

@media screen and (max-width:320px){
	.find-page .step5 .copy{ margin-bottom:1.8rem;}
}



@media screen and (orientation:landscape) and (max-width: 768px){
	body {
		position: relative !important;
		height: 100% !important;
		width: 100% !important;
		overflow: hidden !important;
	}
	body * {
			visibility: hidden !important;
	}
	body:before {
			/*content: '！！！禁止使用横屏，竖屏浏览更佳';*/
			display: block;
			content: "Please don't use landscape screen. Portrait screen provides you better user experience.";
			position: absolute;
			top: 50%;
			left: 0;
			width: 100%;
			padding: 50px;
			text-align: center;
			font-size: 0.2rem;
			-webkit-transform: translate(-0, -50%);
			-moz-transform: translate(-0, -50%);
			-ms-transform: translate(-0, -50%);
			-o-transform: translate(-0, -50%);
			transform: translate(-0, -50%);
		}
	}
}