﻿
/* CSS Document */
:root{
	--main_color:#d80c18;        /* 主色 */
	--main_color_rgb:216,12,24;  /* rgba */
    --main_yell_color:#fff6ed;   /* 辅色 */
}

input::-webkit-input-placeholder {
    color: #fff; /* 针对Chrome, Safari, Opera等WebKit内核浏览器 */
}
input::-moz-placeholder {
    color: #fff; /* 针对Firefox浏览器 */
}
input:-ms-input-placeholder {
    color: #fff; /* 针对Internet Explorer 10+ */
}
input::placeholder {
    color: #fff; /* 针对现代浏览器，包括Chrome, Firefox, Safari, Edge等 */
}

.zzs {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0.2rem 7% 0;
    color: #fff;
}
.zzs a#submit {
    color: #d80c18;
    background: #fff;
    width: 50px;
    padding: 1% 5%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    margin-bottom: 5%;
}

@font-face{ font-family:'alimama'; src: url('/images/alimama.ttf');}
@font-face{ font-family:'Beba'; src: url('/images/BebasNeue-Bold.ttf');}
.t_left_center{ display: flex; flex-direction: column; justify-content: center;}
.flex_start{ display: flex; justify-content: flex-start; flex-wrap: wrap;}
.t_center{ display: flex; flex-direction: column; justify-content: center; align-items: center;}
.width_1600{ width:1500px; margin:0 auto;}
.container-fluid{overflow:hidden;}
.text-with-lines {
    text-align: center;
    position: relative;
    color:#fff; display: flex;
    justify-content: center;
    align-items: center;
    line-height: 50px;
    font-size: 20px;
    font-weight: bold;
}
.text-with-lines::before,
.text-with-lines::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%); /* 垂直居中 */
  width: 40%; /* 横线长度 */
  height: 2px; /* 横线粗细 */
  background: #fff; /* 横线颜色 */
}
 
.text-with-lines::before {
  left: 0;
}
 
.text-with-lines::after {
  right: 0;
}

.liucheng .flex_space {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}

/* 导航 */
#mould87106{width: 1500px;border-radius: 50px;position:fixed;top: 2%;left: 10.6%;background:none;z-index:99;transition: .6s ease-in-out;}
.navbars41{width: 96%;margin:0 auto;display: flex;flex-direction: row;align-items: center;}
.navbars41 .logo{float:left;width: 200px;height: 100%;display: table;margin-top: -10px;}
.navbars41 .logo a{ display: table-cell; vertical-align: middle;}
.navbars41 ul{display: table;height:100%;margin:0 auto;}
.navbars41 li{ display: table-cell; vertical-align: middle; position:relative;}
.navbars41 li a{ padding:0 30px; font-size:18px; font-weight:bold; color:#fff; transition: .4s ease-in-out;}
.navbars41 li a:hover{ color: #ffefc7;}
.navbars41 li .active a{ color: #ffefc7;}
.navbars41 .phone p{ color:#fff; font-size:15px; line-height:15px;}
.navbars41 .phone{ border: 2px solid #fff;width: 216px;text-align: center;border-radius: 50px;}
.navbars41 .phone a{color:#fff;font-family:arial;font-size: 24px;line-height: 50px;/* font-weight:bold; *//* border: 1px solid #fff; *//* padding: 5px 10px; *//* text-align: center; */}

.header_active{ background: #fff!important;filter: drop-shadow(0px 0px 10px rgba(216, 12,24, 0.2));}
.header_active .navbars41{ height:80px;}
.header_active .navbars41 li a{ color:#333;}
.header_active .navbars41 li a:hover{ color: var(--main_color);}
.header_active .navbars41 l i.active a{ color: var(--main_color);}
.header_active .navbars41 .phone p{ color: #222;}
.header_active .navbars41 .phone{ border: 2px solid var(--main_color);}
.header_active .navbars41 .phone a{ color: var(--main_color);}
.header_active .navbars41 .logo{ float:left; width: 200px; height: 100%; display: table;background:url(/images/logo-a.png) no-repeat;background-size:contain; background-position: center;margin-top: -10px;}

#mould87107{ position: relative;}
#mould87107 .swiper-pagination{ bottom:20px;}
#mould87107 .swiper-container .swiper-pagination .swiper-pagination-bullet{ width:30px; height:30px; background:url(/images/icon_btn.png) no-repeat; background-size:cover; opacity:0.3; border-radius:inherit;}
#mould87107 .swiper-container .swiper-pagination .swiper-pagination-bullet-active{ opacity:1;}
#mould87107 .swiper-slide {width: 100%!important;}



/* 关于我们 */
.about_a {background-image: url(/images/about-bg.jpg);background-size: cover;background-repeat: no-repeat;width: 100%;}
.about_a .width_1600{display: flex;flex-direction: row;justify-content: center;align-items: flex-end;box-sizing: border-box;position: relative;/* margin-top: 10%; */padding: 12% 0;}
.about_a .width_1600 .left .titles{margin-bottom: 3%;}
.about_a .width_1600 .left .titles h3{width: 75%;font-size: 62px;font-weight: bold;line-height: 1;background-image: url(/images/you.png);background-repeat: no-repeat;background-size: contain;background-position: right;}
.about_a .width_1600 .left .titles h2{font-size: 62px;line-height: 1.5;}
.about_a .width_1600 .left {flex: 1;padding-right: 20px;box-sizing: border-box;}
.about_a .width_1600 .left .pp {width: 91%;font-size: 16px;line-height: 32px;margin-bottom: 1%;text-indent: 36px;text-align:justify;}
.about_a .width_1600 .left .background-container {position: relative;width: 130px;height: 130px;display: flex;justify-content: center;align-items: center;margin-top: 3%;}
.about_a .width_1600 .left .background-container::before {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-image: url(/images/quan.png);background-size: cover;background-position: center;animation: rotateBackground 10s linear infinite;z-index:9;}
.about_a .width_1600 .left .text-container p {background:var(--main_color);display: flex;color: #fff;border-radius: 50%;width: 72px;height: 72px;animation: scaleBackground 5s infinite alternate ease-in-out;justify-content: center;align-items: center;flex-direction: column;}
.about_a .width_1600 .right {flex: 1.5;max-width: 720px;z-index: 1;}
.about_a .width_1600 .bottom img {position: absolute;top: 13%;right: -7px;animation: rotateBackground 10s linear infinite;}
@keyframes rotateBackground {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
 
@keyframes scaleBackground {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(1.5);
    }
}

/* 加盟流程 */
.liucheng {padding: 5% 0;}
.liucheng .swiper-slide {height: auto;display: flex;flex-direction: column;align-items: center;}
.liucheng .swiper-slide .wz {display: flex;justify-content: center;align-items: center;font-size: 16px;margin-top: 10%;width: 100%;justify-content: space-between;justify-content: center;}
.liucheng .swiper-slide:nth-child(6){ margin-right:0!important;}
.liucheng .swiper-slide img {display: inline-block;width: 60%;height: auto;}
.liucheng .swiper-slide .wz span {width: 26px;height: 26px;background-color: var(--main_color);display: flex;align-items: center;justify-content: center;border-radius: 50%;margin-right: 2%;color:#fff;}
.liucheng .top {margin-bottom: 4%;}
.liucheng .swiper-container .swiper-wrapper {height: auto;width: 1460px!important;}


/* 产品展示 */
.product_a{ width:100%; background:var(--main_color); min-height:480px; padding:60px 0; overflow: hidden;}
.product_a .swiper-wrapper{ transition-timing-function:linear !important;}
.product_a .swiper-slide{overflow:hidden; margin-right:40px;}
.product_a .swiper-slide a{ display:block; width:100%; height:auto;}
.product_a .swiper-slide a img{ width:100%; height:100%;border-radius: 20px;}

.one_box_b{ width:104%; margin:40px 0 40px -2%;}
.one_box_b a{ width:18%; margin:0 1%; float:left; border-radius:12px; overflow:hidden;}
.one_box_b a:nth-child(3){ position:relative; border-radius:inherit;}
.one_box_b a:nth-child(3):after{ content:""; background:var(--main_color) url(/images/logo1.png) no-repeat center; background-size: 52%; width:100%; height:100%; position:absolute; top:0; display:block;}

.one_box_b a img{ width:100%; height:100%;}


/* 分布地图 */
.fenbu {padding: 5% 0;}
.fenbu .left {display: flex;flex-direction: column;flex: 1;}
.fenbu .width_1600{display: flex;flex-direction: row;justify-content: space-between;}
.fenbu .right.aos-init.aos-animate {flex: 1.3;max-width: 840px;}
.fenbu h3 {font-size: 38px;line-height: 1.5;}
.fenbu h2 {color: var(--main_color);font-size: 52px;line-height: 1.5;}
.fenbu .pp{font-size: 18px;line-height: 2;margin:5% 0;}
.shuzi {display: flex;flex-direction: row;justify-content: space-between;}
.shuzi .one h4{background-image: url(/images/fb1.png);background-repeat: no-repeat;background-position: right;margin-right: -66%;}
.shuzi .ones h4{background-image: url(/images/fb2.png);background-repeat: no-repeat;background-position: right;margin-right: -50%;}
.shuzi .oness h4{background-image: url(/images/fb3.png);background-repeat: no-repeat;background-position: right;margin-right: -30%;}
.shuzi h4 {font-size: 32px;font-weight: bold;line-height: 1.5;color:var(--main_color);}
.shuzi {margin-top: 2%;}
.fenbu a {display: flex;justify-content: center;}
.fenbu .background-container {position: relative;width: 130px;height: 130px;display: flex;justify-content: center;align-items: center;}
.fenbu .background-container::before {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-image: url(/images/quan.png); 
background-size: cover;background-position: center;animation: rotateBackground 10s linear infinite;z-index:9;}
.fenbu .text-container p {background:var(--main_color);display: flex;color: #fff;border-radius: 50%;width: 72px;height: 72px;animation: scaleBackground 5s infinite alternate ease-in-out;
justify-content: center;align-items: center;flex-direction: column;}


/* 门店 */
.mendian{margin-bottom: 5%;}
.mendian h2.aos-init.aos-animate {font-size: 52px;text-align: center;font-weight: bold;color: #d80c18;margin-bottom: 4%;}
.mendian ul.clearfix.width_1600.aos-init.aos-animate {display: flex;justify-content: space-evenly;border-top: ;border-top: 1px solid #000;margin-bottom: 2%;}
.mendian_img{text-align: center;}
.mendian_img img{border-radius:20px;}
.mendian ul .on p{background: var(--main_color);border: 3px solid #fff;box-shadow: 0 0 0 4px var(--main_color);}
.mendian ul .on h3{color:var(--main_color);}
.mendian li {display:flex;flex-direction: column;align-items: center;    z-index: 1;margin-top: -10px;}
.mendian span {width: 10px;}

.mendian p {border-radius:50%;width: 14px;height: 14px;border: 3px solid #fff0;box-shadow: 0 0 0 4px #d80c1800;background: #9fa6b2;}
.mendian li:hover p{background: var(--main_color);border: 3px solid #fff;box-shadow: 0 0 0 4px var(--main_color);}
.mendian li h3{color:#9fa6b2;margin-top:2%;}
.mendian li:hover h3{color:var(--main_color);}


/*底部*/
.footer_bg{width: 100%;background: var(--main_color);background-size: cover;padding: 0.3rem 0 0rem 0;}
.main_as.clearfix {display: flex;padding: 3% 0;}
.zzs{flex: 1;display: flex;flex-direction: row;justify-content: space-evenly;align-items: center;}
.zza {display: flex;flex-direction: column;color: #fff;border-right: 1px solid;padding-right: 3%;    margin-right: 3%;}
.zza h2 {font-size: 42px;font-weight: bold;color: #fff;line-height: 1.5;}
.zzs .messages3 {width: auto;background: none;margin-top: 4%;}
.zzs .messages3 ul {display: flex;width: auto;padding: 0;flex-direction: column;}
.zzs .messages3 ul li input {padding: 0;width: 260px;height: 42px;padding-left: 8px;float: left;border: 1px solid;background: #0000;color: #fff;}
.zzs .messages3 ul li input:first-child {margin: 0 0 10px;}
.zzs .messages3 ul li a {width: 160px;height: 36px;line-height: 36px;text-align: center;font-size: 16px;color: #d80c18;background: #FFF;border-radius: 50px;display: inline-block;margin-top: 2%;    margin: 0;}
.zzb {color: #fff;}
.zzb h4 {font-size: 28px;font-weight: bold;line-height: 1.5;}
.zzb p {color: #fff;font-size: 18px;line-height: 1.5;margin-top: 4%;}
.zzb .dz {font-size: 16px;}
.foot_pic {right: 1%;flex: 1.5;max-width: 800px;}
.site-links {margin-top: 2%;width: 100%;}
.site-links ul {list-style: none;padding: 0;margin: 0;display: flex;justify-content: space-between;flex-wrap: wrap;}
.site-links li {margin-bottom: 10px;}
.site-links h4 {font-size: 18px;font-weight: bold;line-height: 40px;}
.site-links a {color: #fff;text-decoration: none;padding: 5px 10px;display: block;transition: background-color 0.3s;}
.site-links h5 {line-height: 30px;}

.copyright {border-top: solid 1px rgba(255,255,255,0.2);color: #fff;text-transform: uppercase;font-size: 16px;}
.copyright .main_a {margin: auto;max-width: 1500px;display: flex;justify-content: space-between;}
.copyright .main_a  p{line-height: 3;}
.copyright .main_a a {color: #fff;}




@media (max-width: 1680px){
#mould87106 {    left: 5%;
    width: 90%;}
.width_1600{width:94%;}.navbars41{width:94%;}
  .mendian_img {width: 85%; margin: 0 auto;}
}
@media (min-width: 1560px) and (max-width: 1679px){
  .about_a .width_1600{padding:8% 0;}
.about_a .width_1600 .left .titles h3 {width:70%;font-size: 54px;}
  .about_a .width_1600 .left .titles h2 {font-size: 54px;}
.fenbu h2{font-size: 48px;}
  .zzs {
    flex: 1;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
}

@media (min-width: 1440px) and (max-width: 1559px) {
.about_a .width_1600{padding: 7% 0;}
  .about_a .width_1600 .left .titles h3 {width: 75%; font-size: 50px;}
.about_a .width_1600 .left .titles h2 {font-size: 50px;}
  .fenbu h2 {font-size: 46px;}
}

@media (min-width: 1360px) and (max-width: 1439px) {
  #mould87106 {left: 4.4%;}
  .fenbu h2 {font-size: 42px;}.fenbu .pp {font-size: 16px;}
  .about_a .width_1600 .left .titles h3 {width: 80%;}
  div#mould74696 {
    margin-left: -6%;
}.navbars41 li a {
  padding: 0px 24px;}
  .about_a .width_1600 .left .titles h3 {width:80%;font-size: 48px;}
  .about_a .width_1600 .left .titles h2 {font-size: 48px;}
  
}


