﻿.clearfix:after{ content: ""; clear: both; visibility: hidden; display: block; height: 0;}
.clearfix{ zoom: 1;}
@font-face{
    font-family: "YSBT";
    src:url("/images/YouSheBiaoTiHei-2.ttf");
}


/*顶部导航*/
.header{ position:fixed; top:0; z-index:98;}
.header .logo{ width:180px; position: fixed; left: 2.6vw; top: 1vw; z-index: 10; display:none;}
.header .header_fr{ position: fixed; right: 2.6vw; z-index: 10; top: 1.5vw; display: flex; align-items: center;}
.z_menu_btn{ 
    width: 43px;
    height: 43px;
    border-radius: 50%;
    background: #fff;
    position: relative;
    cursor: pointer;
    margin-left: 13px;
    display: flex;
    float: right;
    align-items: center;
    justify-content: center;
}
.z_menu_btn span{
    display: block;
    transition: ease .6s;
    width: 20px;
    height: 2px;
    background: #e62129;
}
.z_menu_btn .line2{ margin: 4px 0;}
.z_menu_bg{ 
	position: absolute;
    z-index: -1;
    left: 22px;
    top: 22px;
    width: 120rem;
    padding-top: 120rem;
    margin-top: -60rem;
    margin-left: -60rem;
    background-color: #fbeeee;
    border-radius: 100%;
    transform: scale(0);
    transform-origin: center center;
    transition: all .8s cubic-bezier(.77,0,.175,1);
    background-image: url(/images/zzbg.jpg);
    background-position: left bottom;
    background-repeat: no-repeat;
}
.z_menu_btn.on .line1{ transform:translateY(6px) rotate(45deg);}
.z_menu_btn.on .line3{ transform:translateY(-6px) rotate(-45deg);}
.z_menu_btn.on .line2{ opacity: 0;}
.z_menu_btn.on .z_menu_bg{ transform: scale(1);}
.zdahang{ color: #fff; font-size: 16px; margin-left: 10px; cursor: pointer;}


.z_menu_nav{ position: fixed;opacity: 0;visibility: hidden; transition: ease .5s; right: 0; top:7vw; width:40%; background: none; padding: 0 2.6vw; box-sizing: border-box; z-index: 99;text-align: right;}
.z_menu_nav.on{ opacity: 1; visibility: visible;}
.z_menu_nav li{ margin-bottom: 1.2vw; }
.z_menu_nav li .down{display: inline-block; padding-bottom: 10px; position: relative;}
.z_menu_nav li .down::before{ content: ""; display: block; width: 0; height: 2px; background: #cc242b; transition: ease 1s; position: absolute; right: 0; bottom: 0;}
.z_menu_nav li h3 a{font-size: 1.4vw;}
.z_menu_nav li:hover .down::before{ width: 100%;}
.z_menu_nav .down a{ display: inline-block;font-size: 16px;color: #888888; margin-left: 1.5vw;}
.z_menu_nav .down a:hover{ color: #CC242B;}
.z_menu_mask{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index:9; background: rgba(0,0,0,.4); transition: ease 1s; opacity: 0; visibility: hidden;}
.z_menu_mask.on{ opacity: 1; visibility: visible;}

.z_sq_btn{
    width: 180px;
    height: 50px;
    cursor: pointer;
    transition: ease 1s;
    color: #fff;
    border-radius: 5px;
    margin: 0 auto;
    margin-top: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    background-image: linear-gradient(-90deg, #be1d25, #e62129);

}
.z_sq_btn span{width:25px;}

/*轮播图*/
#mould82379 .swiper-slide img{ height: ;}
#mould82379 .swiper-button-next{ right: 50px!important;}
#mould82379 .swiper-button-prev{ left: 50px!important;}
#mould82379 .swiper-button-next:after,#mould82379 .swiper-button-prev:after{ display:none;}
#mould82379 .swiper-container .swiper-pagination .swiper-pagination-bullet{ background-color:rgb(255, 255, 255);background:rgb(255, 255, 255);opacity:0.5;border-radius:4px; width:30px;}
#mould82379 .swiper-container .swiper-pagination .swiper-pagination-bullet-active{ background-color:rgb(255, 255, 255);background:rgb(255, 255, 255);opacity:1;border-radius:4px; width:30px;}





.width_1600{ width:1600px; margin:0 auto;}
/*简介*/
.about_a{ padding:100px 0;}
.about_a .left{ float:left; width:48%; margin-top:30px; background:url(/images/about_left_bg.png) no-repeat top center;}
.about_a .left h2{ font-family: "YSBT"; text-transform: uppercase; font-size:48px; line-height:40px; color:#206850;}
.about_a .left h3{ font-family: "YSBT"; font-size:40px; line-height:36px; color:#be1d25; margin:15px 0 40px 0;}
.about_a .left p{ line-height:32px;}
.about_a .left a{ width:164px; line-height:54px; display:block; color:#fff; background:#be1d25; border-radius:27px; text-align:right; position:relative; margin-top:64px; padding-right: 24px; box-sizing: border-box;}
.about_a .left a:after{ content:""; width:74px; height:76px; background:url(/images/more_bg.png) no-repeat; position:absolute; bottom:0; left:-12px;}


.about_a .right{ float:right; width:48%; border:8px solid transparent; border-radius:20px; overflow:hidden; transition:.6s;}
.about_a .right img{ width:100%; height:100%; transition:.6s;}
.about_a .right:hover img{ transform:scale(1.1);}
.about_a .right:hover{ border:8px solid #206850; cursor: pointer;}



/*产品*/
.product_a{ background:url(/images/product_bg.jpg) no-repeat; background-size:100% 100%; padding:60px 0; overflow:hidden; position: relative;}
.product_a .title_a{ position: relative; z-index:99;}
.product_a .title_a h3{ color:#fff; -webkit-text-stroke:inherit; margin: 15px 0 30px 0;}

.product_list{ width:auto; position:relative; z-index:1;}
.product_list:after{
	content: "";
    display: block;
    width: 54vw;
    height: 54vw;
    margin-top: -2vw;
    animation: consult2 linear 3s infinite;
    border-radius: 50%;
    background: rgba(0,0,0,.1);
    position: absolute;
    left: 67%;
    top: 50%;
    transform: translate(-50%,-50%);
    visibility: initial;
    z-index:-1;
}

.product_list .gallery-top{ }
.product_list .gallery-top .swiper-slide{ position:relative;}
.product_list .gallery-top .swiper-slide img{ width:560px; height:560px; float:right; margin-right:15%; border-radius:50%; border:3px solid #206850;}
.product_list .gallery-top .swiper-slide .product_txt{ color:#fff; position: absolute; top:10%; left:10%;}
.product_list .gallery-top .swiper-slide .product_txt h2{ font-family: "YSBT"; font-size:48px; line-height:40px; display:inline-block; border:2px dashed #fff; padding: 30px 48px; border-radius: 60px;}
.product_list .gallery-top .swiper-slide .product_txt h3{ font-family: "YSBT"; font-size:60px; line-height:48px; margin-top:48px;}
.product_list .gallery-top .swiper-slide .product_txt p{ font-family: "YSBT"; font-size:24px; line-height:20px; margin-top:20px;}

.product_list .gallery-thumbs{ clear:both; width:1200px; margin-top:30px;}
.product_list .gallery-thumbs .swiper-slide{ border-radius:50%; overflow:hidden; border:3px solid #206850; box-sizing:border-box;}
.product_list .gallery-thumbs .swiper-slide:hover{ cursor: pointer;}

.z_circle{ position: relative;}
.z_circle span{ display: block; border: 1px solid #fff; border-radius: 50%; position: absolute;z-index: 2;animation: spin2 6s infinite linear;transform-origin: 30% 60px;}
.z_circle span:nth-child(1){width:5vw;height:5vw; position: absolute; right: -60px; top: 40%;}
.z_circle span:nth-child(2){width:2vw;height:2vw; position: absolute; right: 11.33333vw; top: 10vw; animation: spin 6s infinite linear;}
.z_circle span:nth-child(3){width:4vw;height:4vw; position: absolute; left: 20.33333vw; top: 6vw;}
.z_circle span:nth-child(4){width:2vw;height:2vw; position: absolute; left: 48.33333vw; top: 30vw;}
.z_circle span:nth-child(5){width:1vw;height:1vw; position: absolute; left: 8.33333vw; top: 24vw;}
.z_circle span:nth-child(6){width:3vw;height:3vw; position: absolute; right: 38.33333vw; bottom: 6vw;animation: spin 6s infinite linear;}
.z_circle span:nth-child(7){width:2vw;height:2vw; position: absolute; right: 18.33333vw; bottom: 20vw;}

@keyframes consult2{
  0%,100%{transform:translate(-50%,-50%) scale(.5) ;}
  50%{transform:translate(-50%,-50%) scale(1);}	
} 
@keyframes spin{
  to{transform: rotate(1turn);}
}
@keyframes spin2{
  to{transform: rotate(-1turn);}
}

/*加盟*/
.join_a1{ padding:80px 0; background:url(/images/bangdan_bg.png) no-repeat left bottom 30%;}
.join_a .left{ float:left; width:56%; background:#be1d25 url(/images/chuan_bg1.png) no-repeat top -40px left 20px; border-top-left-radius:20px; border-bottom-left-radius:20px; padding:70px 50px 50px; box-sizing:border-box;}
.title_a{ text-align:Center;}
.title_a h2{ font-family: "YSBT"; text-transform: uppercase; font-size:30px; line-height:24px; color:#fff;}
.title_a h3{ font-family: "YSBT"; font-size:48px; line-height:40px; color:#206850; -webkit-text-stroke: 1px #fff;
  
  margin:15px 0 48px 0;}
.join_a .left .join_list{ width:48%; float:left; background:#fff; padding:36px 24px; box-sizing:border-box; border-radius:8px;}
.join_a .left .join_list1{ float:right;}
.join_a .left .join_list:nth-child(-n+3){ margin-bottom:4%;}
.join_a .left .join_list:nth-child(n+4){ margin-bottom:6%;}
.join_a .left .join_list h2{ text-align:Center; font-weight:bold; font-size:20px; line-height:20px; margin-bottom:24px;}
.join_a .left .join_list p{ line-height:28px; height:84px;}
.join_a .left a{ clear:both; width:164px; line-height:54px; display:block; color:#fff; background:#206850; border-radius:27px; text-align:right; position:relative; margin:0 auto; padding-right: 24px; box-sizing: border-box;}
.join_a .left a:after{ content:""; width:74px; height:76px; background:url(/images/more_bg.png) no-repeat; position:absolute; bottom:0; left:-12px;}

.join_a .right{ float:right; width:41%;}
.join_a .right .right_box{ border-top-right-radius:20px; padding:60px 50px 40px 50px; margin-bottom:30px; box-sizing:border-box; background:#be1d25 url(/images/chuan_bg2.png) no-repeat top 12px right 12px;}
.join_a .right .right_box h2{ font-family: "YSBT"; font-size:36px; line-height:30px; color:#fff; margin-bottom:20px;}
.join_a .right .right_box p{ line-height:28px; font-family: "YSBT"; color:#fff; font-size:28px; line-height:48px;}

.messages3{ width: 100%; background: #206850; border-bottom-right-radius:20px; padding:40px 50px 40px 50px; box-sizing:border-box;}
.messages3 h2{ font-family: "YSBT"; font-size:36px; line-height:30px; color:#fff; margin-bottom:20px;}
.messages3 ul{ padding: 0; width: 100%;}
.messages3 ul li input:first-child{ margin: 0; margin-bottom: 10px;}
.messages3 ul li input,.messages3 ul li textarea{ font-size:15px; float: inherit; height: 50px; background: none; color: #fff; padding: 0; padding-left: 14px; width: 100%; border: 1px solid rgba(255,255,255,0.6); border-radius: 8px; margin: 0;}
.messages3 ul li input:focus,.messages3 ul li textarea:focus{ box-shadow:none; border: 1px solid rgba(255,255,255,0.6);}
.messages3 ul li textarea{ height: 120px; padding-top: 14px;}
.messages3 ul li input{ margin-bottom: 10px;}
.messages3 ul li a{ transition: 0.5s; width:164px; height:54px; line-height:54px; font-size:16px; display:block; color:#e62129; background:#fff; border-radius:27px; text-align:right; position:relative; 
  margin:30px auto 0 auto; padding-right: 24px; box-sizing: border-box;}
.messages3 ul li a:after{ content:""; width:74px; height:76px; background:url(/images/more_bg.png) no-repeat; position:absolute; bottom:0; left:-12px;}

input::-webkit-input-placeholder{ color: rgba(255,255,255,0.6);}
input:-moz-placeholder{ color: rgba(255,255,255,0.6);}
input:-ms-input-placeholder{ color: rgba(255,255,255,0.6);}
textarea::-webkit-input-placeholder{ color: rgba(255,255,255,0.6);}
textarea:-moz-placeholder{ color: rgba(255,255,255,0.6);}
textarea:-ms-input-placeholder{ color: rgba(255,255,255,0.6);}
.join_a .left .join_list:hover{ background:#206850; color: #fff;}

/*好评榜单*/
.title_b{ text-align:Center; margin-top:64px;}
.title_b h2{ font-family: "YSBT"; text-transform: uppercase; font-size:36px; line-height:24px; color:#206850;}
.title_b h3{ font-family: "YSBT"; font-size:48px; line-height:40px; color:#e62129; margin:15px 0 48px 0;}

.favorable .left{ width:22%; float:left; border-radius:12px; overflow:hidden; box-shadow:0 0 10px rgba(0,0,0,0.3);}
.favorable .left #mould82379 .swiper-container .swiper-pagination .swiper-pagination-bullet{ background:#206850; opacity:1; border-radius:5px; width:10px; height:10px;}
.favorable .left #mould82379 .swiper-container .swiper-pagination .swiper-pagination-bullet-active{ background:#e62129;}

.favorable1{ width:76%; float:right; position:relative;}
.favorable1:after{ content:""; width:805px; height:498px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:url(/images/haoping.png) no-repeat; z-index:9;}
.favorable1 .swiper-container{ padding:10px; box-sizing:border-box;}
.favorable1 .swiper-wrapper{
  -webkit-transition-timing-function:linear;
  -moz-transition-timing-function:linear;
  -ms-transition-timing-function:linear;
  -o-transition-timing-function:linear;
  transition-timing-function:linear;
}
.favorable1 .swiper-slide{ border-radius:12px; overflow:hidden; box-shadow:0 0 10px rgba(0,0,0,0.3);}


/*加盟热线*/
.joining_bg{ width:100%; background:url(/images/joining_bg.jpg) no-repeat; background-attachment: fixed; padding:100px 0; text-align:center; color:#fff; z-index:1; overflow: hidden; position:relative;}
.joining_bg:after{ content:"Brand Advantages"; width:100%; font-family: arial; font-size:220px; color: rgba(0,0,0,0); text-stroke: 3px #fff; -webkit-text-stroke: 3px #fff; 
  position:absolute; bottom:-5%; left:0; opacity: .6; letter-spacing:6px; z-index:-1;}
.joining_bg h2{ font-family: "YSBT"; font-size:72px; line-height:60px;}
.joining_bg p{ font-size:32px; margin:30px 0 72px 0;}
.joining_bg h3{ font-family: "YSBT"; font-size:72px; line-height:60px; margin-bottom:24px;}
.joining_bg span{ display:inline-block; line-height:80px; font-size:48px; font-weight:bold; font-family: arial; background:#fff; color:#206850; padding:0 48px; border-radius:36px;}


.footer_a1{ width:100%; background:url(/images/foot_bg.jpg) no-repeat bottom;}
/*新闻*/
.news_a{ margin-bottom:100px;}
.news_a .swiper-container{ padding:10px; box-sizing:border-box;}
.news_a .swiper-slide{ border-radius:12px; overflow:hidden; background:#f8f8f8; padding:24px; box-sizing:border-box;}
.news_a .swiper-slide .img{ width:100%; height:292px; overflow:hidden; border-radius:12px;}
.news_a .swiper-slide .img img{ width:100%; height:100%; transition:.6s;}
.news_a .swiper-slide:hover .img img{ transform:scale(1.1);}
.news_a .swiper-slide .txt{ padding:10px 0 30px 0;}
.news_a .swiper-slide .txt h3{ font-size:24px; line-height:24px; font-weight:bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.news_a .swiper-slide .txt time{ margin-bottom:10px; display:block;}
.news_a .swiper-slide:hover{ background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.3);}
.news_a .swiper-slide:hover .txt h3{ color:#e62129;}
.news_a .swiper-slide:hover .txt time{ color:#206850;}


.footer_a .left{ float:left;}
.footer_a .left h2{ font-size:24px; font-weight:bold; color:#fff; margin:64px 0 18px 0;}
.footer_a .left p{ line-height:20px; color:#fff;}
.footer_a .right{ float:right;}
.footer_a .right .foot_nav_a{ margin-top:36px;}
.footer_a .right .foot_nav_a a{ font-size:18px; font-weight:bold; margin:0 24px; color:#fff;}

.foot_share{ float:right; margin-top:180px;}
.foot_share a{ width:80px; height:80px; display:block; border-radius:10px; float:left; position:relative; background:#fff url(/images/btn_icon.png) no-repeat;}
.foot_share a:nth-child(-n+2){ margin-right:18px;}
.foot_share a:nth-child(2){ background-position:-80px 0;}
.foot_share a:nth-child(3){ background-position:-160px 0;}
.foot_share a div{ width:120px; height:120px; position:absolute; bottom:90px; left:50%; margin-left:-60px; box-shadow: 0 0 8px rgb(0 0 0 / 10%); transition:.5s; transform: scale(0); transform-origin: center bottom;}
.foot_share a:hover div{ transform: scale(1);}


.footer-foot{ background:none; border-top:1px solid rgba(255,255,255,0.5); margin-top:48px;}
.footer-foot p{ line-height:72px; float:left; color:#fff;}
.footer-foot p a{ color:#fff;}
.footer-foot p:last-child{ float:right;}


@media (max-width:1680px){ 
  .width_1600{ width:94%;}
  .news_a .swiper-slide .img{ height:242px;}
  .joining_bg:after{ font-size:168px; bottom:-3%;}
  .product_list:after{ margin-top:-4vw; left:65%;}
}

@media (max-width:1440px){ 
  .z_menu_btn.on .z_menu_bg{ transform: scale(.8);}
  .about_a{ padding:80px 0;}
  .about_a .left{ margin-top:0;}
  .about_a .left h3{ margin: 15px 0 24px 0;}
  .about_a .left a{ margin-top:30px;}
  .join_a .left .join_list p{ height:112px;}
  .joining_bg:after{ font-size:156px;}
}

@media (max-width:1360px){ 
  .joining_bg:after{ font-size:150px;}
  .news_a .swiper-slide .img{ height:215px;}
}
  
  
  
