@charset "utf-8";
/* CSS Document */
html,body {position: relative; height: 100%;min-height: 740px;}
.swiper {width: 100%; height: 100%;}
.swiper-slide {font-size: 18px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center;}
.swiper-slide .swiper-slide-img {position: absolute; top: 50%; left: 50%; z-index: 100; width: 100%; transform:translate(-50% , -50%);}
.swiper-slide .swiper-slide-img img {display: block; width: 60%; max-width: 1060px; margin: 0 auto;}
.swiper-slide .swiper-slide-background {display: block; width: 100%; height: 100%; object-fit: cover;}

.mySwiper .swiper-pagination-box {position: absolute; bottom: 0; z-index: 10; width: 100%; height: 72px; background-color: rgba(0,0,0,.3);}
.mySwiper .swiper-pagination1 {bottom: 42px;}
.mySwiper .swiper-pagination1 span{position: relative; display: inline; height: 16px; margin: 0 12px!important; padding-bottom: 10px; font-size: 16px; color: #fff; line-height: 16px; letter-spacing: 1px; background-color: rgba(0,0,0,0); opacity: 1;}
.mySwiper .swiper-pagination1 span::before {content: ""; position: absolute; bottom: 0; left: 50%; width: 0; height: 2px; background-color: #fff; opacity: 0; transform: translateX(-50%); }
.mySwiper .swiper-pagination1 .swiper-pagination-bullet-active::before {width: 100%; opacity: 1; transition: all 0.4s;}
.index-footer-copyright {position: absolute; bottom: 2px; left: 0; z-index: 10; display: flex; justify-content: center; width: 100%;}
.index-footer-copyright p {margin-bottom: 2px; font-size: 16px; line-height: 16px; color: #fff;}
.index-footer-copyright a {margin-bottom: 2px; margin-left: 20px; font-size: 16px; line-height: 18px; color: #fff;}
.index-footer-copyright a img {display: block;}
@media(max-width:980px){.swiper-slide .swiper-slide-img img {width: 80%;} .index-footer-copyright {flex-wrap: wrap;}}
@media(max-width:860px){.mySwiper .swiper-pagination-box {height: 90px;} .mySwiper .swiper-pagination1 {bottom: 60px;}}
@media(max-width:480px){.mySwiper .swiper-pagination-box {height: 140px;} .mySwiper .swiper-pagination1 {bottom: 105px;} .mySwiper .swiper-pagination1 span {margin: 0 6px!important; letter-spacing: 0;}}

/*about*/
.about {position: absolute; top: calc(50%); left: 50%; width: 80%; transform: translate(-50% , -50%);}
.about-title:nth-child(1) {font-size: 38px; line-height: 38px; color: #212121; text-align: center; font-weight: lighter; letter-spacing: 2px;}
.about-title:nth-child(1) span {letter-spacing: 0;}
.about-title:nth-child(2) {margin-top: 20px; margin-bottom: 40px; font-size: 36px; line-height: 36px; color: #cd050f; font-weight: bold; text-align:center; letter-spacing: 16px;}
.about-title:nth-child(2) span {letter-spacing: 0;}
.about-txt {margin-top: 20px; font-size: 24px; line-height: 42px; color: #333; text-align: center; font-weight: lighter; letter-spacing: 1px;}
.about-buttom {display: flex; justify-content: space-between; width: 730px; margin: 40px auto 0;}
.about-buttom a {position: relative; display: block; width: 160px; padding: 0 20px; border: 2px solid #888; font-size: 18px; line-height: 42px; color: #333; text-align: left; box-sizing: border-box; transition: all 0.3s;}
.about-buttom a::before {content: "+"; position: absolute; top: 50%; right: 20px; font-size: 18px; color: #333; transform: translateY(-50%)}
.about-buttom a:hover {padding: 0 30px; border: 2px solid #cd050f; color: #fff; background-color:  #cd050f;}
.about-buttom a:hover::before {color: #fff;}
@media(max-width:960px){.about {width: 96%;}}
@media(max-width:760px){.about-title:nth-child(1) {font-size: 20px; line-height: 20px; letter-spacing: 1px;} .about-title:nth-child(2) {margin-bottom: 30px; font-size: 24px; line-height: 24px; letter-spacing: 2px} .about-txt {font-size: 18px; line-height: 32px;font-weight: normal;} .about-buttom {flex-wrap: wrap; width: 350px; margin: 0 auto;} .about-buttom a {margin-top: 20px;}}

/*industry*/
.industry {position: absolute; top: calc(50% - 60px); left: 50%; width: 80%; transform: translate(-50% , -50%);}
.industry p:nth-child(1) {font-size: 24px; line-height: 24px; color: #fff; text-align: left; font-weight: bold; letter-spacing: 10px;}
.industry p:nth-child(2) {width: 60%; margin: 20px 0; font-size: 18px; line-height: 32px; color: #fff; text-align: left; letter-spacing: 1px;}
.industry a:nth-child(3) {position: relative; display: block; width: 160px; padding: 0 20px; border: 2px solid #fff; font-size: 18px; line-height: 42px; color: #fff; text-align: left; box-sizing: border-box; transition: all 0.3s;}
.industry a:nth-child(3)::before {content: "+"; position: absolute; top: 50%; right: 20px; font-size: 18px; color: #fff; transform: translateY(-50%);}
.industry a:nth-child(3):hover {padding: 0 30px; border: 2px solid #cd050f; color: #fff; background-color:  #cd050f;}
.industry a:nth-child(3):hover::before {color: #fff;}
.industry-right p:nth-child(1),.industry-right p:nth-child(2) {text-align: right!important;}
.industry-right p:nth-child(2) {margin: 20px 0 20px auto;}
.industry-right a {margin: 0 0 0 auto;}
.mySwiper3 .swiper-pagination3 {bottom: 90px; width: 100%; height: 90px;}
.mySwiper3 .swiper-pagination3 span {position: relative; width: 160px; height: 90px; margin: 0 10px!important; border-radius: 0; opacity: 1;} 
.mySwiper3 .swiper-pagination3 span::before {position: absolute; bottom: 10px; left: 50%; z-index: 11; font-size: 16px; color: #fff; transform: translateX(-50%);}
.mySwiper3 .swiper-pagination3 span:nth-child(1)::before {content: "零售产业";}
.mySwiper3 .swiper-pagination3 span:nth-child(3)::before {content: "餐饮产业";}
.mySwiper3 .swiper-pagination3 span:nth-child(2)::before {content: "烘焙产业";}
.mySwiper3 .swiper-pagination3 span:nth-child(4)::before {content: "烘焙产业";}
.mySwiper3 .swiper-pagination3 span::after {content: ""; position: absolute; top: 0; left: 0; z-index: 10; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4);}
.mySwiper3 .swiper-pagination3 span img {width: 100%; height: 100%;}
.swiper-pagination-bullet-active {opacity: 1!important;}
.swiper-pagination-bullet-active::after {background-color: rgba(0,0,0,0.1)!important;}
.swiper-slide-industry-background::before {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2);}
/*.swiper-slide-industry-background:nth-child(2)::before {background-color: rgba(0,0,0,0.3);}*/
@media(max-width:1660px){.industry p:nth-child(2) {width: 80%;}}
@media(max-width:1200px){.industry p:nth-child(1),.industry p:nth-child(2) {text-align: center!important;} .industry p:nth-child(2) {margin: 20px auto!important;} .industry a {margin: 0 auto!important;}}
@media(max-width:960px){.industry p:nth-child(2) {width: 100%;}}
@media(max-width:860px){.industry {width: 96%;} .mySwiper3 .swiper-pagination3 {bottom: 110px;}}
@media(max-width:740px){.industry {top: calc(50% - 130px);} .mySwiper3 .swiper-pagination3 {left: calc(50% - 170px); width: 340px; height: 200px;} .mySwiper3 .swiper-pagination3 span {margin: 5px!important;} .industry p:nth-child(1) {font-size: 20px; line-height: 20px;} .industry p:nth-child(2) {font-size: 16px; line-height: 30px;}}
@media(max-width:480px){.mySwiper3 .swiper-pagination3 {bottom: 120px;}}

/*news*/
.news {position: absolute; top:calc(50%); left: 50%; width: 100%; padding: 0 5%; box-sizing: border-box; transform: translate(-50%,-50%); overflow: hidden;}
.news-top {display: flex; justify-content: space-between; width: 100%; border-bottom: 1px solid #999;}
.news-top-title {width: 200px; padding-bottom: 24px;}
.news-top-title p:nth-child(1) {margin-bottom: 12px; font-size: 18px; line-height: 18px; color: #333; letter-spacing: 1px; font-weight: lighter;}
.news-top-title p:nth-child(2) {font-size: 36px; line-height: 36px; color: #cd050f; font-weight: 600 ;letter-spacing: 2px;}
.news-top-nav {display: flex; justify-content: space-between; width: 280px; padding-top: 24px;}
.news-top-nav li {height: 42px;}
.news-top-nav li a {position: relative; display: block; font-size: 18px; line-height: 42px; text-align: center; color: #333;}
.news-top-nav li a::before {content: ""; position: absolute; bottom: -26px; left: 50%; width: 0; height: 3px; background-color: #cd050f; transform: translateX(-50%); transition: all 0.6s;}
.news-top-nav li a:hover {color: #cd050f;}
.news-top-nav li a:hover::before {width: 100%;}
.news-top-nav-active a {color: #cd050f!important;}
.news-top-nav-active a::before {width: 100%!important;}

.news-list {display: flex; justify-content: space-between; width: 100%; margin-top: 50px;}
.mySwiper4 {padding-bottom: 30px; overflow: inherit;}
.news-list a {position: relative; display: block; width: 100%; box-sizing: border-box;}
.news-list-title {width: 100%; font-size: 24px; line-height: 36px; color: #333; letter-spacing: 1px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; box-sizing: border-box}
.news-list-picture {position: relative; width: 100%; height: 300px; margin-top: 20px; border-radius: 10px; overflow: hidden;}
.news-list-picture::after {content: "查看详情"; position: absolute; top: 50%; left: 50%; z-index: 11; width: 72px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; font-size: 18px; line-height: 36px; color: #eee; text-align: center; transform: translate(-50%,-50%); opacity: 0; transition: all 0.6s;}
.news-list-picture::before {content: ""; position: absolute; top: 50%; left: 50%; z-index: 10; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); transform: translate(-50%,-50%); opacity: 0; transition: all 0.6s;}
.news-list-picture p {position: absolute; bottom: 20px; left: 20px; z-index: 100; display: block; width: 120px; font-size: 16px; color: #ccc; text-align: center; line-height: 36px; border-radius: 19px; background-color: rgba(0,0,0,0.8);}
.news-list-picture img {display: block; width: 100%; min-height: 100%; transition: all 0.6s;}
.news-list a:hover .news-list-title {color:#cd050f;}
.news-list a:hover .news-list-picture::after {width: 90px; opacity: 1;}
.news-list a:hover .news-list-picture::before {opacity: 1;}
.news-list a:hover .news-list-picture img {transform: scale(1.2);}

.mySwiper4 .swiper-scrollbar {width: 100%; height: 5px; background-color: rgba(0,0,0,0);}
.mySwiper4 .swiper-scrollbar::before {content: ""; position: absolute; top: 2px; left: 0; width: 100%; height: 1px; background-color: #999;}
.swiper-scrollbar-drag {height: 5px; border-radius: 0; background-color: #cd050f; }

@media(max-width:1200px){.news {padding: 0 2%;  top: calc(50% - 25px);}}
@media(max-width:560px){ .news-top {flex-wrap: wrap; border-bottom: 0;} .news-top-title {width: 100%; padding-bottom: 20px; border-bottom: 1px solid #999;} .news-top-nav { padding-top: 10px;} .news-top-nav li a::before {bottom: -6px;} .news-list {margin-top: 20px;}}

/*contact*/
.contact {position: absolute; top: calc(50%); left: 50%; display: flex; align-items: stretch; width: 90%; transform: translate(-50% , -50%);}
.contact-left {width: 560px; height: 570px; padding: 40px; background-color: rgba(0,0,0,0.7); box-sizing: border-box;}
.contact-left-title:nth-child(1) {font-family: bebas; font-size: 42px; font-weight: bold; color: #fff; line-height: 42px; letter-spacing: 8px;}
.contact-left-title:nth-child(2) {margin: 10px 0 20px; font-size: 24px; line-height: 24px; color: #fff; letter-spacing: 1px;}
.contact-left-title:nth-child(2) span {font-size: 16px;}
.contact-left-text {margin-bottom: 10px; padding-left: 65px; font-size: 16px; line-height: 26px; color: #fff; letter-spacing: 1px; background-repeat: no-repeat; background-size: 50px 50px; background-position: 0 50%; box-sizing: border-box;}
.contact-left-text span {font-size: 20px; line-height: 34px;}
.contact-left-text:nth-child(3) {background-image: url("../UploadFiles/bj/contactzx.png");}
.contact-left-text:nth-child(4) {background-image: url("../UploadFiles/bj/contactdh.png");}
.contact-left-text:nth-child(5) {background-image: url("../UploadFiles/bj/contactdz.png");}
.contact-left-img-txt {margin-top: 30px; margin-bottom: 10px; font-size: 16px; line-height: 30px; color: #fff;}
.contact-left-img {display: block; width: 120px;}

.contact-map {width: calc(100% - 560px); height: 570px;}

@media(max-width:1200px){.contact {width: 96%;}}
@media(max-width:1000px){.contact {flex-wrap: wrap;} .contact-left {display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; height: auto; padding: 26px;} .contact-left-title:nth-child(1) {display: none;}.contact-left-title:nth-child(1),.contact-left-title:nth-child(2) {width: 100%;} .contact-left-text:nth-child(5) {width: 100%; margin-bottom: 0;} .contact-left-img-txt,.contact-left-img {display: none;} .contact-map {width: 100%; height: 260px;}}