@charset "utf-8";
.back-color{ background: #f5f5f5; }
.ptb70{ padding: 70px 0; }
.header{ width: 100%;height: 60px;line-height: 60px;position: fixed;top: 0;left: 0; z-index: 999;}
.header .logo_img{ display:table-cell;max-width:170px;max-height:60px; vertical-align:middle;text-align:center; }
.header .logo_img img{ max-height:60px;vertical-align: middle; }
.header.down,
.header:hover{ background:rgba(0,0,0,.5);transition: 300ms; }
/** Nav **/
.nav{ width: 700px;float: left;position: relative;margin-left: 80px; }
.nav ul li{float: left;width: 90px;text-align: center;margin:0 3px;line-height: 60px;}
.nav ul li a{font-size: 14px;color: #ddd;line-height: 60px;display: block;}
.nav ul li a:hover{ color: #326ccd; }
.m-nav-act {height: 3px;line-height: 3px;background-color: #326ccd;position: absolute;
    bottom: 0;left: 0;width: 50px;opacity: 0;transition: left .5s;-moz-transition: left .5s;-webkit-transition: left .5s;-o-transition: left .5s;z-index: 1;}
.menu_list{height: 300px;top:57px;width: 1200px;z-index: 9999;visibility: hidden;position: absolute;left:0;margin-left: -160px;padding-top: 3px;}
.menu_li{width: 1200px;margin:0 auto;background-color: #fff;overflow: hidden;padding-bottom: 15px;box-shadow:1px 1px 3px #ddd;}
.menu_li ul{width: 180px;float: left;margin-top: 20px;margin-right: 30px;margin-left: 30px;margin-bottom: 15px}
.menu_li ul:last-child{margin-right: 0;}
.menu_li p{height: 40px;line-height: 40px;border-bottom: 1px solid #ddd;font-size: 14px;margin-bottom: 10px;font-weight: bold;text-align: left}
.menu_li ul li a{font-size: 12px;color: #666;line-height: 30px; }
.menu_li ul li{ width: 100%; line-height: 30px;clear:both; }
.menu_li ul li em{display: block;width: 30px;height: 12px;background: url(../img/hot.png) 0 0 no-repeat;float: left;margin-top: 8px;margin-left: 5px;}
.menu_li ul li span{float: left;}
.menu_li ul li a:hover span{text-decoration: underline;color: #4a85f8;}
.menu_li ul li small{display: block;width: 30px;height: 12px;background: url(../img/new.png) 0 0 no-repeat;float: left;margin-top: 8px;margin-left: 5px;}
.hover_menu1:hover .menu_list{ visibility: visible; }
.hover_menu2:hover .menu_list2{ visibility: visible; }
.menu2{width: 142px;padding:5px 0;background-color: #fff;overflow: hidden;box-shadow:1px 1px 3px #ddd;}
.menu2 ul li{width: 100%;line-height: 30px;text-align: left;margin-left: 20px}
.menu2 ul li a{font-size: 13px;color: #666666;line-height: 30px}
.menu2 ul li a:hover{color: #4a85f8;}
.menu_list2{height: auto;position: absolute;top:57px;width: 146px;z-index: 9999;left:0;visibility: hidden;margin-left: 250px;padding-top: 3px;}
.js-nav{z-index: 1}
/*--------------
* Banner
----------------*/
.slide-banner{ width: 100%;height: 500px; }
.slide-banner .slide1{display: block;height: 500px; }
.slide-banner .slide1 .inner{width: 100%;height: 100%;display: block;}
.slide-banner .slide1 .banner_con{ width: auto;height: 100%;overflow: hidden; }
.slide-banner .banner_btns{margin:0 auto;width:auto; padding-top:335px;}
.slide-banner .banner_btns .banner_btn{float:left;margin-left:10px;margin-right:10px;width:170px;height:45px;line-height:45px;text-align:center;border:1px solid rgba(255,255,255,0.4);color:#fff;}
.slide-banner .banner_btns .banner_btn a{ color:#fff; }
.slide-banner .banner_btns .banner_btn:hover{border:1px solid #fff;background:#fff;color:#000;}
.slide-banner .banner_btns .banner_btn a:hover{ color:#000; }
/** txt **/
.slide-banner .container{position: relative; height: 100%;}
.slide-banner .txt-left{ max-width: 50%; position: absolute;bottom:110px;left: 0; width: 490px; }
.slide-banner .txt-left h5{ font-size: 40px;font-weight: bold;color: #fff;padding-bottom: 5px; }
.slide-banner .txt-left p{ color:rgba(255,255,255,.8);}
.slide-banner .bottom-a a{ float: left; display: block;width: 108px;height: 34px;line-height: 34px;color: #fff; text-align: center;
    border: 1px solid #fff;margin-right: 8px; }
.slide-banner .bottom-a a:hover{ background: #4a85f8;border-color: #4a85f8; }
.slide-banner .txt-right{ position: absolute;right: 0;bottom: 0; }
.slide-banner  .txt-right img{ display: block; }
/*--------------
* Function
----------------*/
.comm-title{ text-align: center;margin-bottom: 30px; }
.comm-title h5{ font-weight: bold;font-size: 36px;color: #1e1e1e; }
.trans{ -webkit-transition: all .4s ease-out;transition: all .4s ease-out; }
.functions{ position: relative; }
.functions.ptb70{ padding: 70px 0 20px; }
.functions .slide-function{ padding-bottom: 50px; }
.functions .swiper-slide{ text-align: center; }
.functions .swiper-slide .remark h5{ font-size: 24px;padding-bottom: 5px; }
.functions .swiper-slide .remark .sub-tit{ width: 300px; color: #666;margin: 0 auto; }
.functions .swiper-slide .remark img{ display: block;max-width: 100%;margin: 0 auto; }
.functions .swiper-pagination-bullet{ width: 16px;height: 16px; }
/*--------------
* Charac
----------------*/
.charac.ptb70{ padding-bottom: 45px; }
.charac ul li{ display: flex;align-items: center;padding: 0 35px; float: left; width: 515px;height: 160px;background: #fff;margin-bottom: 25px; }
.charac ul li:nth-of-type(even){ float: right; }
.charac ul li img{ display: block;min-width: 92px;min-height: 92px; width: 92px;height: 92px;margin-right: 20px; }
.charac ul li:hover{ box-shadow: 0 0 20px rgba(0,0,0,.3) }
/*--------------
* Case
----------------*/
.case .cons{ border: 1px solid #e5e5e5;border-radius: 5px;overflow: hidden; }
.case .cons ul li{ float: left; width: 20%;height: 198px;border-right: 1px solid #e5e5e5; }
.case .cons ul li:nth-of-type(5n){ width: calc(20% - 4px); border-right: 0; }
.case .cons ul li:nth-of-type(n+6){ border-top: 1px solid #e5e5e5; }
.case .cons ul li .imgs{ display: block;width: 90px;height: 90px;margin: 39px auto 20px;border-radius: 20px;box-shadow: 0 0 20px rgba(0,0,0,.5);overflow: hidden; }
.case .cons ul li .imgs img{ display: block;max-width: 100%; }
.case .cons ul li h5{ text-align: center;font-size: 16px; }
.case .cons ul li:hover .imgs{
    -webkit-animation-name:bounce;
    -webkit-animation-duration: .6s;
    -webkit-animation-timing-function: ease-out;
    animation-name:bounce;
    animation-duration: .6s;
    animation-timing-function: ease-out;
}
@-webkit-keyframes bounce {
    0%,100%,20%,53%,80% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1);
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    40%,43% {
        -webkit-transition-timing-function: cubic-bezier(.755,.050,.855,.060);
        transition-timing-function: cubic-bezier(.755,.050,.855,.060);
        -webkit-transform: translate3d(0,-30px,0);
        transform: translate3d(0,-30px,0)
    }

    70% {
        -webkit-transition-timing-function: cubic-bezier(.755,.050,.855,.060);
        transition-timing-function: cubic-bezier(.755,.050,.855,.060);
        -webkit-transform: translate3d(0,-15px,0);
        transform: translate3d(0,-15px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-4px,0);
        transform: translate3d(0,-4px,0)
    }
}

@keyframes bounce {
    0%,100%,20%,53%,80% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1);
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    40%,43% {
        -webkit-transition-timing-function: cubic-bezier(.755,.050,.855,.060);
        transition-timing-function: cubic-bezier(.755,.050,.855,.060);
        -webkit-transform: translate3d(0,-30px,0);
        transform: translate3d(0,-30px,0)
    }

    70% {
        -webkit-transition-timing-function: cubic-bezier(.755,.050,.855,.060);
        transition-timing-function: cubic-bezier(.755,.050,.855,.060);
        -webkit-transform: translate3d(0,-15px,0);
        transform: translate3d(0,-15px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-4px,0);
        transform: translate3d(0,-4px,0)
    }
}
/*--------------
* Flows
----------------*/
.flows ul li{ float: left; width: 280px;height: 385px;background: #fff;margin-right: 26px; }
.flows ul li:last-child{ margin-right: 0; }
.flows ul li img{ display: block;max-width: 100%; }
.flows ul li .remark{ padding: 15px 20px 0; }
.flows ul li .remark h5{ font-size: 16px;padding-bottom: 5px; }
.flows ul li .remark p{ color: #666; }
.flows ul li .remark a{ display: block;width:calc(100% - 2px);height: 38px;line-height: 38px; text-align: center; border: 1px solid #4a85f8;
    color: #4a85f8;margin-top: 23px;
}
.flows ul li:hover{ box-shadow: 0 0 20px rgba(0,0,0,.3) }
/*--------------
* Service
----------------*/
.service.ptb70{ padding-bottom: 50px; }
.service ul li{ display: flex;align-items: center; float: left; width: 25%;padding: 20px 0; }
.service ul li img{ display: block;width: 92px;height: 92px;margin-right: 8px; }
.service ul li .remark h5{ font-size: 16px;font-weight: bold; }
.service ul li .remark p{ color: #666; }
/*--------------
* Contact
----------------*/
.contact{ width: 100%;height: 240px;text-align: center; }
.contact h5{ color: #fff;font-size: 36px;font-weight: bold;padding: 75px 0 15px; }
.contact a{ display: block;width: 138px;height: 35px;border: 1px solid #fff;text-align: center;line-height: 35px;color: #fff;margin: 0 auto; }
.contact a:hover{ background: #4a85f8;border-color: #4a85f8; }
/*-----------------------------
* 众拼分销返利商城系统 19-07-29 Add
-------------------------------*/
.shop-fun .cons .swiper-button-prev,
.shop-fun .cons .swiper-button-next{ width: 32px;height: 58px;background: url("../img/slide-ico.png") no-repeat 0 0; }
.shop-fun .cons .swiper-button-prev{ left: 0; }
.shop-fun .cons .swiper-button-next{ right: 0;background-position: -43px 0; }
.shop-fun .cons .swiper-button-prev.swiper-button-disabled{ background-position: 0 -67px }
.shop-fun .cons .swiper-button-next.swiper-button-disabled{ background-position: -43px -67px }

.charac ul li h5{ font-size: 16px;font-weight: bold; }
/** Character **/
.character .cons{ position: relative;  }
.character .cons .cover-img{ display: block;max-width: 100%;margin: 0 auto; }
.character .cons ul li{ position: absolute;top: 29px; width: 345px; display: flex;align-items: center;z-index: 5; }
.character .cons ul li:nth-of-type(1){ left: 94px; }
.character .cons ul li:nth-of-type(3){ top: 245px }
.character .cons ul li:nth-of-type(5){ left: 40px;top: 490px; }
.character .cons ul li:nth-of-type(2){ width: 423px; right: 60px; }
.character .cons ul li:nth-of-type(4){ right:0;top: 245px }
.character .cons ul li:nth-of-type(6){ width: 390px; right: 40px;top: 490px; }
.character .cons ul li:nth-of-type(even){ flex-direction:row-reverse;text-align: right; }
.character .cons ul li:nth-of-type(even) img{ margin-right: 0;margin-left: 13px; }
.character .cons ul li img{ display: block;min-width: 90px; width: 90px;height: 90px;margin-right: 13px; border-radius: 65px; box-shadow: 0 0 15px rgba(0,0,0,.2);overflow: hidden; }
.character .cons ul li .remark h5{ font-size: 20px;color: #333;font-weight: bold; }
.character .cons ul li .remark p{ color: #666; }
/** setmeal **/
.setmeal .cons ul li{ float: left; width: 378px;height: 583px;border: 1px solid #e0e0e0;margin-right: 30px;overflow: hidden; }
.setmeal .cons ul li:last-child{ margin-right: 0; }
.setmeal .cons ul li .tops{ position:relative;height:134px;padding: 0 30px; }
.setmeal .cons ul li .tops h5{ font-size:18px;color:#000;font-weight:bold;padding:33px 0 13px; }
.setmeal .cons ul li .tops p{ font-size:13px;color:#666; }
.setmeal .cons ul li .tops em{ opacity: 0; position: absolute;top: 0;right: 0; display: block;width: 85px;height: 83px; }
.setmeal .cons ul li .remark{ padding: 0 30px; }
.setmeal .cons ul li .centers{ padding-top:15px;height:334px;border: 1px solid #dcdcdc;border-width:1px 0; }
.setmeal .cons ul li .centers p{ line-height: 39px;color: #666; }
.setmeal .cons ul li .centers p i{ float:left;display:block;width:6px;height:6px;background:#999;border-radius: 65px;margin: 17px 5px 0 0; }
.setmeal .cons ul li .bottoms{  }
.setmeal .cons ul li .bottoms .moey{ display:block;float:left;font-size:32px;color:#ff3e32;margin-top:35px; }
.setmeal .cons ul li .bottoms .moey em{ font-size:16px;padding-right:3px; }
.setmeal .cons ul li .bottoms a{ float:right;display:block;width:140px;height:40px;line-height:40px;text-align:center;background:#4a85f8;color:#fff;
    margin-top:29px;
}
.setmeal .cons ul li.on{ height: 607px;margin-top: -10px; box-shadow: 0 0 20px rgba(0,0,0,.3); }
.setmeal .cons ul li.on .tops{ background: #4a85f8; }
.setmeal .cons ul li.on .tops h5{ color: #fff; }
.setmeal .cons ul li.on .tops p{ color: rgba(255,255,255,.7); }
.setmeal .cons ul li:nth-of-type(2).on .tops em{ opacity: 1; background: url("../img/shop/fanli-biaoqian.png") no-repeat; }
.setmeal .cons ul li.on .bottoms a{ background: #f87301; }