@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+SC&display=swap');
#foods-content { width: 100%; margin: 0; padding: 0; }
#topnavi { background: url("../img/topnavi-bg.jpg") repeat-x left top; height: 46px; width: 100%; }
#topnavi ul { margin: 0 auto; width: 948px; }
/**menu修改**/
/**menu修改**/
#topnavi ul li { display: inline; float: left; margin: 0; width: 157px; height: 46px; margin-right: 1px;}
#topnavi ul li a {font-family:'Noto Sans SC',Arial, Verdana, sans-serif; background: url(../img/topnav-bg.jpg) top center no-repeat; height: 46px; display: block; color: #A4E7EC; line-height: 46px; text-align: center; font-size: 14px;  font-weight: 500;}
/*#topnavi ul li a.listmenu_1 { background: url(../img/topnavi1.jpg) top center no-repeat; display: block; width: 135px; height: 46px; }
#topnavi ul li a.listmenu_2 { background: url(../img/topnavi2.jpg) top center no-repeat; display: block; width: 135px; height: 46px; }
#topnavi ul li a.listmenu_3 { background: url(../img/topnavi3.jpg) top center no-repeat; display: block; width: 135px; height: 46px; }
#topnavi ul li a.listmenu_3_1 { background: url(../img/topnavi3_1.jpg) top center no-repeat; display: block; width: 135px; height: 46px; }
#topnavi ul li a.listmenu_4 { background: url(../img/topnavi4.jpg) top center no-repeat; display: block; width: 135px; height: 46px; }
#topnavi ul li a.listmenu_5 { background: url(../img/topnavi5.jpg) top center no-repeat; display: block; width: 135px; height: 46px; }
#topnavi ul li a.listmenu_6 { background: url(../img/topnavi6.jpg) top center no-repeat; display: block; width: 135px; height: 46px; }*/
#topnavi ul li a.active { background-position-y: -46px; }
#topnavi ul li a:hover { background-position-y: -46px; text-decoration: none; }
/**menu修改**/
#breadcrumbs { height: 50px; width: 980px; line-height: 40px; margin: 0 auto; text-align: left; color: #9ca0a3; position: relative; }
#breadcrumbs a { color: #9ca0a3; text-decoration: underline; }
#breadcrumbs a:hover { color: green; }
#breadcrumbs a:visited { color: #9ca0a3; }
#breadcrumbs .sfmenu { width: 102px; height: 33px; position: absolute; right: 120px; top: 7px; }
#breadcrumbs .sfmenu a { width: 102px; height: 33px; display: block; background: url(../img/menu.png); text-indent: -9999px; overflow: hidden; z-index: 9; }
#breadcrumbs .sfmenu a:hover { background-position: 0 -33px; }
#breadcrumbs .sfback { width: 102px; height: 33px; position: absolute; right: 0px; top: 7px; }
#breadcrumbs .sfback a { width: 102px; height: 33px; display: block; background: url(../img/back.png); text-indent: -9999px; overflow: hidden; z-index: 9; }
#breadcrumbs .sfback a:hover { background-position: 0 -33px; }
#breadcrumbs .back { width: 40px; height: 33px; position: absolute; right: 0; top: 2px; }
#breadcrumbs .back  a{text-decoration:none;}
#breadcrumbs .sf_prev { position: absolute; right: 965px; top: 280px; }
#breadcrumbs .sf_prev a { width: 100px; height: 100px; display: block; background: url(../img/sf_prve.png); text-indent: -9999px; overflow: hidden; z-index: 9; }
#breadcrumbs .sf_prev a:hover { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
#breadcrumbs .sf_next { position: absolute; right: -118px; top: 280px; }
#breadcrumbs .sf_next a { width: 100px; height: 100px; display: block; background: url(../img/sf_next.png); text-indent: -9999px; overflow: hidden; z-index: 9; }
#breadcrumbs .sf_next a:hover { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
#breadcrumbs .hmenu { width: 102px; height: 33px; position: absolute; right: 120px; top: 7px; }
#breadcrumbs .hmenu a { width: 102px; height: 33px; display: block; background: url(../img/menuh.png); text-indent: -9999px; overflow: hidden; z-index: 9; }
#breadcrumbs .hmenu a:hover { background-position: 0 -33px; }
#breadcrumbs .hback { width: 102px; height: 33px; position: absolute; right: 0px; top: 7px; }
#breadcrumbs .hback a { width: 102px; height: 33px; display: block; background: url(../img/backh.png); text-indent: -9999px; overflow: hidden; z-index: 9; }
#breadcrumbs .hback a:hover { background-position: 0 -33px; }
#breadcrumbs .h_prev { position: absolute; right: 965px; top: 280px; }
#breadcrumbs .h_prev a { width: 100px; height: 100px; display: block; background: url(../img/h_prve.png); text-indent: -9999px; overflow: hidden; z-index: 9; }
#breadcrumbs .h_prev a:hover { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
#breadcrumbs .h_next { position: absolute; right: -118px; top: 280px; }
#breadcrumbs .h_next a { width: 100px; height: 100px; display: block; background: url(../img/h_next.png); text-indent: -9999px; overflow: hidden; z-index: 9; }
#breadcrumbs .h_next a:hover { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
#markDiv { position: fixed; _position: absolute; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; _height: 1080px; background: #000000; opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
.dialog { position: fixed; _position: absolute; z-index: 10000; left: 50%; top: 233px; width: 980px; height: 600px; margin: 0 0 0 -490px; box-shadow: 0px 0px 16px #000000; -moz-box-shadow: 0px 0px 16px #000000; -webkit-box-shadow: 0px 0px 16px #000000; }
.dialog .container { position: relative; }
.dialog .container .close { width: 80px; height: 80px; display: block; overflow: hidden; text-indent: -9999px; position: absolute; right: 0; top: 0; }
.qs_index { width: 980px; margin: 0 auto 40px auto; overflow: hidden; height: 600px; position: relative; -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, .1); box-shadow: 0 0 15px rgba(0, 0, 0, .1); }
.qs_bg { background: url(../img/delicious_bg.jpg) top center repeat-x #FFF; }
.qs_index .waterbg { background: url(../img/qs12_bg.jpg) 0 0 no-repeat; width: 980px; height: 600px; position: absolute; left: 0; top: 0; z-index: 0; }
.qs_index .light { background: url(../img/light.png) center center no-repeat; width: 980px; height: 600px; position: absolute; left: 0; top: 0; z-index: 8; animation-iteration-count: infinite; }
.qs_index .back1 { background: url(../img/back1.png) center center no-repeat; width: 460px; height: 600px; position: absolute; left: 260px; top: 0; z-index: 11; }
.qs_index .item { width: 182px; height: 78px; display: block; position: absolute; z-index: 9 }
.qs_index .item1 { left: 77px; top: 104px; animation-delay: 0.5s; }
.qs_index .item2 { left: 722px; top: 104px; animation-delay: 1s; }
.qs_index .item3 { left: 77px; top: 470px; animation-delay: 1.5s; }
.qs_index .item4 { left: 720px; top: 471px; animation-delay: 2s; }

.qs_index .itembig { width: 210px; height: 220px;display: block; position: absolute; z-index: 9;overflow:hidden; text-indent:-9999px; z-index:12;}
.qs_index .itembig1 { left: 274px; top: 104px;  }
.qs_index .itembig2 { left: 500px; top: 104px;  }
.qs_index .itembig3 { left: 274px; top: 334px;  }
.qs_index .itembig4 { left: 500px; top: 334px;  }


/*.qs_index p { margin-bottom: 30px;  }
.qs_index p a{transition:all 0.3s linear;-webkit-transition:all 0.3s linear;-moz-transition:all 0.3s linear; display:block;  width:980px; height:210px;}
.qs_index p a:hover { opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)";}*/
.safe_index { width: 980px; margin: 15px auto 40px auto; overflow: hidden; }
.safe_bg { background: url(../img/safetybg.jpg) repeat-x; }
.h_index { width: 980px; margin: 15px auto 40px auto; overflow: hidden; }
.h_bg { background: url(../img/healthbg.jpg); }
.d_index { width: 980px; margin: 0 auto; overflow: hidden }
.d_bg { background: url(../img/delicious_bg.jpg); }
.d_index p { margin-bottom: 30px; background: #000; }
.d_index p a { transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; display: block; width: 980px; height: 200px; }
.d_index p a:hover { opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; }
/*water*/
.water { width: 980px; margin: 0 auto 30px auto; background: #FFF; -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, .1); box-shadow: 0 0 15px rgba(0, 0, 0, .1); }
.water .banner { background: url(../img/waterbanner.jpg) center center no-repeat; height: 293px; }
.water .banner h1 { font-family: simsun; text-align: center; line-height: 150%; font-size: 50px; color: #231815; padding: 50px 0 0 0; margin: 0; font-weight: bold; }
.water .banner h2 { text-align: center; font-family: simsun; font-size: 14px; color: #333; font-weight: 100; padding: 20px 0 0 0; margin: 0; }
.water .text { background: url(../img/watertext.jpg); height: 75px; margin: 0; }
.water .text h3 { font-size: 18px; color: #FFF; font-family: simsun; line-height: 75px; text-align: center; font-weight: 800; -webkit-text-shadow: 1px 1px 1px rgba(0, 0, 0, .51); -moz-text-shadow: 1px 1px 1px rgba(0, 0, 0, .51); text-shadow: 1px 1px 1px rgba(0, 0, 0, .51); }
.water .photo { width: 650px; height: 190px; background: #D1ECFB; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 0 auto; }
.water .photo ul { height: 170px; padding: 10px 20px; text-align: center; }
.water .photo li { float: left; list-style: none; width: 130px; }
.water .photo li.last { width: 213px; position: relative; }
.water .photo .zs { position: absolute; left: 200px; top: -63px; }
.water .photo p { max-width: 213px; font-size: 12px; font-family: simsun; text-align: center; }
.water .waclear { height: 50px; clear: both; }
/*raw*/
.raw { width: 980px; margin: 0 auto 30px auto; background: #FFF; -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, .1); box-shadow: 0 0 15px rgba(0, 0, 0, .1); }
.raw .banner { background: url(../img/raw-banner.jpg) center center no-repeat; height: 326px; }
.raw .banner h1 { font-family: simsun; text-align: center; line-height: 100%; font-size: 50px; color: #231815; padding: 70px 0 0 0; margin: 0; font-weight: bold; }
.raw .banner h1 span { display: block; margin: 0 auto; width: 300px; text-align: center; }
.raw .banner h1 .r1 { font-size: 25px; font-weight: 100px; }
.raw .banner h1 .r2 { font-size: 28px; border-top: 2px solid #000; font-weight: 100px; }
.raw .banner h1 .r3 { font-size: 48px; border-bottom: 2px solid #000; padding-bottom: 10px; }
.raw .text { background: url(../img/watertext.jpg); height: 75px; margin: 0; }
.raw .text h3 { font-size: 18px; color: #FFF; font-family: simsun; line-height: 75px; text-align: center; font-weight: 800; -webkit-text-shadow: 1px 1px 1px rgba(0, 0, 0, .51); -moz-text-shadow: 1px 1px 1px rgba(0, 0, 0, .51); text-shadow: 1px 1px 1px rgba(0, 0, 0, .51); }
.raw .photo { width: 850px; height: 160px; background: #D1ECFB; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 0 auto; }
.raw .photo ul { padding: 20px; text-align: center; }
.raw .photo li { float: left; list-style: none; width: 200px; }
.raw .photo li p{width:180px; text-align:left; font-family: simsun; line-height:150%; font-size: 18px; margin:0; padding:0; color:#000; }
.raw .waclear { height: 50px; clear: both; }

/*bottle*/
.bottle { width: 980px; margin: 0 auto 30px auto; background: #FFF; -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, .1); box-shadow: 0 0 15px rgba(0, 0, 0, .1); }
.bottle .banner { background: url(../img/bottlebanner.jpg) center center no-repeat; height: 193px; }
.bottle .banner h1 { font-family: simsun; text-align: center; line-height: 130%; font-size: 36px; color: #231815; padding: 50px 0 0 0; margin: 0; font-weight: bold; }
.bottle .text {height: 55px;  }
.bottle .text h3{ font-size: 22px; color: #000; font-family: simsun; line-height: 55px; text-align: left; font-weight: 800; margin: 0 113px; padding:0;}
.bottle .photo {text-align:center;}
.bottle .waclear { height: 50px; clear: both; }

/*safe*/
.safe { width: 980px; margin: 0 auto 30px auto; height:600px;   background: url(../img/safe.jpg) center center no-repeat; -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, .1); box-shadow: 0 0 15px rgba(0, 0, 0, .1); }


/*hot*/
.hot { width: 980px; height:600px; margin: 0 auto 30px auto; background: url(../img/back4-bg.jpg) center center no-repeat;-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, .1); box-shadow: 0 0 15px rgba(0, 0, 0, .1); }
.hot .banner { height: 160px; }
.hot .banner h1 { font-family: simsun; text-align: left; line-height: 150%; font-size: 50px; color: #de4d16; padding: 50px 0 0 0; margin: 0; font-weight: bold; text-indent:70px; animation-delay: 0.5s;}
.hot .banner h2 { text-align: center; font-family: simsun; font-size: 14px; color: #333; font-weight: 100; padding: 20px 0 0 0; margin: 0; }
.hot .photo {width:900px; margin:0 auto;}
.hot .photo ul { height: 401px; text-align: center; margin:0; padding:0;}
.hot .photo li{ float: left; list-style: none; width:300px; height:401px; display:block; overflow:hidden; text-indent:-9999px; }
.hot .photo li.item1{background: url(../img/back4-1-2019.png) center center no-repeat; animation-delay: 1s;}
.hot .photo li.item2{background: url(../img/back4-2-2019.png) center center no-repeat; animation-delay: 1.5s;}
.hot .photo li.item3{background: url(../img/back4-3.png) center center no-repeat; animation-delay: 2s;}
.hot .waclear { height: 50px; clear: both; }


/*hot*/
.lemon { width: 980px; height:600px; position:relative; margin: 0 auto 30px auto; background: url(../img/back5.jpg) center center no-repeat;-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, .1); box-shadow: 0 0 15px rgba(0, 0, 0, .1); }
.lemon .banner { height: 240px; }
.lemon .banner h1 { font-family: simsun; text-align: left; line-height: 150%; font-size: 50px; color: #004098; padding: 50px 0 0 0; margin: 0; font-weight: bold; text-indent:70px; animation-delay: 0.5s;}
.lemon .photo {width:900px; margin:0 auto;}
.lemon .photo .pz{ position: absolute; left: 101px; top: 234px; background: url(../img/back5-0.png) center center no-repeat; width: 100px; height: 320px; animation-delay: 1s; }
.lemon .photo ul { height: 401px; text-align: center; margin: 0; padding: 0; position: absolute; left: 295px; top: 223px; }
.lemon .photo li{ list-style: none; width:435px; height:115px; padding-left:175px;  display:block; }
.lemon .photo li h2 { text-align: left; font-family: simsun; font-size: 20px; color: #004098; font-weight: 100; padding: 20px 0 0 0; margin: 0; font-weight:800; line-height:150%; } 
.lemon .photo li p{ text-align: left; font-family: simsun; font-size: 12px; color: #004098; font-weight: 100; padding: 20px 0 0 0; margin: 0;  line-height:150%; margin:0; padding:0; text-indent:14px; background:url(../img/dot.png) 5px 8px no-repeat;} 
.lemon .photo li p.left{float:left; width:200px;}
.lemon .photo li p span{font-family: "Microsoft YaHei"; font-size:14px; font-weight:800; }
.lemon .photo li.item1{background: url(../img/back5-1.png) no-repeat; animation-delay: 1.5s;}
.lemon .photo li.item2{background: url(../img/back5-2.png) no-repeat; animation-delay: 2s;}
.lemon .photo li.item3{background: url(../img/back5-3.png) no-repeat; animation-delay: 2.5s;}
.lemon .waclear { height: 50px; clear: both; }

/*qsoolong*/
.qsoolong { width: 980px; margin: 0 auto 30px auto;-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, .1); box-shadow: 0 0 15px rgba(0, 0, 0, .1); }
#topcontrol{opacity:0;}