﻿﻿/* CSS Document */
/*banner
-----------------------------------------*/
.pics_wrap{ background-color:#fff;}
#html5zoo-1{ height:auto !important;}

/*三大平台
-----------------------------------------*/
.platform{ background-color:#fff; padding:2.813rem 0 0.75rem;}
.platform .title{ text-align:center; font-size:1.5em;}
.platform ul{ width:90%; margin:0 auto; margin-top:1rem;}
.platform ul li{ float:left; width:33.33333%; box-sizing:border-box; margin:0 auto; margin-bottom:0.75rem;}
.platform ul li>div{ margin:1.563rem; border:0.063rem solid #eee; background-color:#f8f8f8; border-left:0.625rem solid; position:relative; padding:10px 0;}
.platform ul li>div:before{ content:''; position:absolute; top:1.25rem; left:0px; border:0.688rem solid transparent; height:0; width:0;}
.platform ul li:nth-child(1)>div{ border-left-color: #ffb539;}
.platform ul li:nth-child(1)>div:before{ border-left-color: #ffb539;}
.platform ul li:nth-child(2)>div{ border-left-color: #ff3952;}
.platform ul li:nth-child(2)>div:before{ border-left-color: #ff3952;}
.platform ul li:nth-child(3)>div{ border-left-color: #00bde7;}
.platform ul li:nth-child(3)>div:before{ border-left-color: #00bde7;}
.platform ul li .title{ font-size:1.25em; margin-top:0.438rem; margin-left:1.563rem; margin-bottom:0.625rem; text-align:left;}
.platform .p-text{  font-size:0.875em; color:#999; margin-left:1.5rem;}
.platform .btn-box{ margin-top:1.25rem; margin-bottom:0.375rem;}
.platform .btn-box>a{ display:block; vertical-align:middle; height:2.5rem; line-height:2.5rem; width:43%; text-align:center; margin:0 auto;}
.platform .btn-box .login-btn{ font-size:1em; color:#fff; background-color:#27a3fe; transition:all 0.2s; -webkit-transition:all 0.2s; border-radius:0.125rem;}
.platform .btn-box .login-btn:hover{ background-color:#05ad05;}
.platform .btn-box .register-btn{ color:#999;  font-size:0.875em; box-sizing:border-box;}
.platform .btn-box .register-btn:hover{ color:#27a3fe; border:0.063rem solid #27a3fe; line-height:38px;}

/*行业板块*/
.Industry_plate{ padding:40px 0; background-color:#f8f8f8; color:#fff;}
.Industry_plate .title{ width:1000px; margin:0 auto; height:50px; color:#333; line-height:50px; font-size:1.5em; text-align:center;}
.plate{ width:1000px; margin:0 auto;}
.plate .plate_list{ width:100%; margin-top:30px;}
.plate .plate_list .plateBox{ float:left; width:33.3333%;margin-bottom:30px;}
.plateBox .P_cont{ width:220px; height:220px; border:2px solid #fe6458; border-radius:110px; margin:0 auto; background-color:#fff; overflow:hidden; text-align:center; cursor:default;}
.plateBox .P_cont .p_icon{ height:80px; line-height:80px; font-size:52px; color:#27a3fe;}
.plateBox .P_cont .title{ background-color:#fe6458; height:40px; position:relative; width:100%; font-size:18px; line-height:40px; color:#fff;}
.plateBox .P_cont .text{ color:#333; font-size:18px; height:50px; line-height:50px;}
.plateBox .P_cont .into{ display:inline-block; position:relative; width:90px; height:30px; border-radius:4px; overflow:hidden;  background-color:#fe6458; line-height:30px; font-size:14px; cursor:pointer;}
.plateBox .P_cont .into>a{ display:block; color:#fff; height:30px;}
.plateBox .P_cont .into:hover{ top:2px;}

/*微小店插件*/
.wxd_plug{ background-color:#fff; padding-bottom:50px;}
.wxd_plug .title{ text-align:center;  font-size:1.5em; height:140px; line-height:140px;}
.wxd_plug .plug-list{ width:1000px; margin:0 auto; text-align:center; position:relative; height:273px;}
.wxd_plug .plug-list li{ position:absolute; width:123px; height:123px; -webkit-transform:rotate(45deg); transform:rotate(45deg); background-color:#6ba9fc;}
.wxd_plug .plug-list li:nth-child(1){ left:138px; top:25px;}
.wxd_plug .plug-list li:nth-child(2){ left:338px; top:25px;}
.wxd_plug .plug-list li:nth-child(3){ left:538px; top:25px;}
.wxd_plug .plug-list li:nth-child(4){ left:738px; top:25px;}
.wxd_plug .plug-list li:nth-child(5){ left:238px; top:125px;}
.wxd_plug .plug-list li:nth-child(6){ left:438px; top:125px;}
.wxd_plug .plug-list li:nth-child(7){ left:638px; top:125px;}
.wxd_plug .plug-list .p_bg1{ background-color:#6ba9fc;}
.wxd_plug .plug-list .p_bg2{ background-color:#76c972;}
.wxd_plug .plug-list .p_bg3{ background-color:#bf74fb;}
.wxd_plug .plug-list .p_bg4{ background-color:#7edffb;}
.wxd_plug .plug-list .p_bg5{ background-color:#fd3769;}
.wxd_plug .plug-list .p_bg6{ background-color:#fc8918;}
.wxd_plug .plug-list .p_bg7{ background-color:#fe6458;}
.wxd_plug .plug-list li a{ display:block; width:100%; height:100%; -webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
.wxd_plug .plug-list li a em{ font-style:normal; color:#fff;}
.wxd_plug .plug-list li img{ display:block; width:70%; margin:0 auto;}

/*vip插件*/
.vip_plugs{ background-color:#f8f8f8; position:relative;padding:175px 0;}
.wwdc15 {font-size: 24px; position:relative;}
.wwdc15 span {display: block;margin:0 auto; width: 240px; height: 240px;position:absolute; left: -webkit-calc(50% - 120px); left: calc(50% - 120px); bottom:65px;}
.wwdc15 .large-circles { -webkit-animation: spin 10s linear infinite; animation: spin 10s linear infinite;}
.wwdc15 .small-shapes { -webkit-animation: spin 30s linear infinite; animation: spin 30s linear infinite;}
.wwdc15 .circle {display:block; width:100%; height: 100%; position: absolute; border-top: 1px solid rgba(255, 255, 255, 0.4); border-radius: 50%; left: -webkit-calc(50% - 120px); left: calc(50% - 120px); top: -webkit-calc(50% - 240px); top: calc(50% - 240px); -webkit-transform-origin: 50% 240px; -ms-transform-origin: 50% 240px; transform-origin: 50% 240px;}
.wwdc15 .one { background: rgba(16, 63, 236, 0.75); -webkit-transform: rotateZ(0deg); transform: rotateZ(0deg);}
.wwdc15 .two { background: rgba(37, 172, 162, 0.75); -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg);}
.wwdc15 .three { background: rgba(233, 124, 32, 0.75); -webkit-transform: rotateZ(90deg); transform: rotateZ(90deg);}
.wwdc15 .four { background: rgba(235, 67, 35, 0.75); -webkit-transform: rotateZ(135deg); transform: rotateZ(135deg);}
.wwdc15 .five { background: rgba(190, 28, 65, 0.75); -webkit-transform: rotateZ(180deg); transform: rotateZ(180deg);}
.wwdc15 .six { background: rgba(208, 57, 159, 0.75);-webkit-transform: rotateZ(225deg); transform: rotateZ(225deg);}
.wwdc15 .seven {background: rgba(150, 32, 198, 0.75); -webkit-transform: rotateZ(270deg); transform: rotateZ(270deg);}
.wwdc15 .eight { background: rgba(95, 33, 203, 0.75); -webkit-transform: rotateZ(315deg);transform: rotateZ(315deg);}
.wwdc15 .small { width: 100px;height:  100px; left: -webkit-calc(50% - 50px);left: calc(50% - 50px); top: -webkit-calc(50% - 315px);top: calc(50% - 315px);-webkit-transform-origin: 50% 315px; -ms-transform-origin: 50% 315px; transform-origin: 50% 315px;text-align:center; line-height:50px;color:#fff; -webkit-box-shadow: 0 0.5px 1px rgba(0, 0, 0, 0.2);box-shadow: 0 0.5px 1px rgba(0, 0, 0, 0.2);}
.wwdc15 .small img{ width:100%;}
.wwdc15 .content { text-align: center; position:relative; background:#fff;  border:5px solid #e5e5e5; border-radius:50%; width: 370px; height: 370px;  -webkit-transform: none;  -ms-transform: none;  transform: none; box-sizing:border-box; margin:0 auto;}
.wwdc15 .content h1 { font-size: 24px; margin: 54px auto 28px;  max-width:100%; color:#333; font-weight:300;}
.wwdc15 .content p{ font-size:16px; line-height:30px; color:#333;}
.wwdc15 .content .more_btn{ display:inline-block; padding:0 30px; border-radius:4px; font-size:16px; color:#fff; background-color:#27a3fe; height:40px; line-height:40px; transition:all 0.3s linear; -webkit-transition:all 0.3s linear; margin-top:20px;}
.wwdc15 .content .more_btn:hover{ background-color:#e60012;}


@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotateZ(0);
        transform: rotateZ(0);
    }
    100% {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotateZ(0);
        transform: rotateZ(0);
    }
    100% {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }
}

@-webkit-keyframes spin-pulse {
    0% {
        -webkit-transform: scale(1) rotateZ(0);
        transform: scale(1) rotateZ(0);
    }
    50% {
        -webkit-transform: scale(0.9) rotateZ(180deg);
        transform: scale(0.9) rotateZ(180deg);
    }
    100% {
        -webkit-transform: scale(1) rotateZ(360deg);
        transform: scale(1) rotateZ(360deg);
    }
}

@keyframes spin-pulse {
    0% {
        -webkit-transform: scale(1) rotateZ(0);
        transform: scale(1) rotateZ(0);
    }
    50% {
        -webkit-transform: scale(0.9) rotateZ(180deg);
        transform: scale(0.9) rotateZ(180deg);
    }
    100% {
        -webkit-transform: scale(1) rotateZ(360deg);
        transform: scale(1) rotateZ(360deg);
    }
}

/*插件
-----------------------------------------*/
.plugs{ background-color:#f8f8f8; padding:2.5rem 0;}
.plugs .title{ text-align:center;  font-size:1.5em;}
.plugs .plugList{ margin-top:1.875rem; text-align:center;}
.plugs .plugList li.info{ display:inline-block; width:20%;  vertical-align:top;}
.plugs .plugList li.info>a{ display:block; margin:5%; min-height:13.75rem; padding-top:1.563rem; box-sizing:border-box;}
.plugs .plugList li.info dt.icon{ display:block; width:5.313rem; height:5.313rem; margin:0 auto; transition:all 0.5s; -webkit-transition:all 0.5s; box-sizing:content-box;}
.plugs .plugList li.info dd.cont-title{ display:block; text-align:center;  font-size:1em; line-height:3.125rem;}
.plugs .plugList li.info dd.cont-text{ display:block; text-align:center; line-height:1.063rem;  font-size:0.875em; color:#8b9496;}
.plugs .plugList li.info .website{ background-image:url(../images/plug-pintuan.png);}
.plugs .plugList li.info .distribu{ background-image:url(../images/plug-sjfx.png);}
.plugs .plugList li.info .indiana{ background-image:url(../images/plug-duobao.png);}
.plugs .plugList li.info .luck_draw{ background-image:url(../images/plug-zhuanpan.png);}
.plugs .plugList li.info .scratch_card{ background-image:url(../images/plug-guaguaka.png);}
.plugs .plugList li.info .vote{ background-image:url(../images/plug-waimai.png);}
.plugs .plugList li.info .crowd_funding{ background-image:url(../images/plug-zhongchou.png);}
.plugs .plugList li.info .auction{ background-image:url(../images/plug-paimai.png);}
.plugs .plugList li.info .sign{ background-image:url(../images/plug-qiandao.png);}
.plugs .plugList li.info .zero_buy{ background-image:url(../images/plug-lingyuangou.png);}
.plugs .plugList li.info .seckill{ background-image:url(../images/plug-miaosha.png);}
.plugs .plugList li.info .price_shoot{ background-image:url(../images/plug-jiangjiapai.png);}
.plugs .plugList li.info>a:hover{ background-color:#fff;}
.plugs .plugList li.info>a:hover .icon{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);}
.plugs .more{ margin-top:0.625rem;}


/*案例
-----------------------------------------*/
.case{ background-color:#fff; padding:2.813rem 0;}
.case .title{ text-align:center;  font-size:1.5em;}
.case .case-line{ height:0.063rem; background-color:#d8d5d5; width:100%; margin-top:35px;}
.case .btn-box{ width:14%; height:1.25rem; margin:0 auto; background-color:#fff; position:relative; top:-0.625rem;}
.case .btn-box .left-arrow{ position:absolute; height:1.25rem; width:1.25rem; background:url(../images/left-arrow.png) no-repeat center center; top:0; left:50%; margin-left:-1.875rem; cursor:pointer;}
.case .btn-box .right-arrow{ position:absolute; height:1.25rem; width:1.25rem; background:url(../images/right-arrow.png) no-repeat center center; top:0; right:50%; margin-right:-1.875rem; cursor:pointer;}
.case .case-cont{ margin-top:2.5rem;}
.case .case-cont ul li{ float:left; width:25%; padding:0.625rem; box-sizing:border-box;}
.case .case-cont ul li>div{ background-color:#fff; position:relative; border:0.063rem solid #e2e2e2;}
.case .case-cont ul li>div .imgBox{ width:100%; height:186px; overflow:hidden;}
.case .case-cont ul li>div .imgBox img{ height:100%; display:block; margin:0 auto;}
.case .case-cont ul li>div:hover{ box-shadow:0 0 0.625rem rgba(0,0,0,0.5);}
.case .case-cont ul li>div .cont-info{ margin:10px; padding-bottom:10px; margin-top:35px; text-align:center;}
.case .case-cont ul li>div .cont-info .cont-title{ font-size:0.875em; margin-bottom:10px;}
.case .case-cont ul li>div .cont-info .cont-text{ font-size:0.75em; color:#9d9d9d; line-height:20px; height:60px; overflow:hidden;}
.case .case-cont ul li>div .QR-icon{ display:block; position:absolute; top:158px; left:50%; margin-left:-1.75rem; width:56px; height:56px; border-radius:50%; border:0.188rem solid #fff; box-sizing:border-box; cursor:pointer; background:url(../images/qr-icon.png) no-repeat center center; background-color:#27a3fe;}
.case .case-cont ul li>div .QR-img{ display:none; position:absolute; height:186px; top:0; padding:1.875rem; box-sizing:border-box; left:0; right:0; background:rgba(0,0,0,0.5); text-align:center; transition:all 0.5s; -webkit-transition:all 0.5s; cursor:pointer; text-align:center;}
.case .case-cont ul li>div .QR-img>img{ display:block; width:7.875rem; height:7.875rem; margin:0 auto;}
.case .case-cont ul li>div .QR-icon:hover+.QR-img{ display:block;}
.case .more{ margin-top:1.25rem;}

/*合作伙伴
-----------------------------------------*/
.partner{ background-color:transparent; padding:1.875rem 0;}
.partner .title{ text-align:center; color:#fff;  font-size:1.5em;}
.partner .allbrand{ margin-top:2.5rem;}
.partner .allbrand .brand{width:100%;height:auto;overflow:hidden;}
.partner .allbrand .brand>div{ float:left;width:16.66666%; padding:7.5px;height:85px; box-sizing:border-box;margin-bottom:2px}
.partner .allbrand .brand a{display:block;position:relative;line-height:52.5px;text-align:center;color:#fff; font-size:0.875em; border:2px solid #dcdcdc; box-sizing:border-box; height:74px;}
.partner .allbrand .brand a img{position:absolute; left:0; top:0;width:100%;height:100%;}
.partner .allbrand .brand a b{display:none;position:absolute; left:0; top:0;width:100%;height:100%; background:rgba(0,0,0,0.7);cursor:pointer;overflow:hidden;}


@media screen and (max-width: 1199px){
.platform{ padding:30px 0; height:auto;}
.theme1 .main-container{ width:100% !important; padding:20px; box-sizing:border-box; height:auto !important;}
.theme1 .slider_holder{ width:100% !important;}
.theme1 .page-more{ width:100% !important;}
.theme1 .details .d-cont .QRinfo{ width:290px; background-size:290px; height:114px; z-index:999; margin-left:-145px;}
.partner .allbrand{ margin-top:30px;}
.partner .allbrand .brand{width:100%;height:auto;overflow:hidden;}
}

@media screen and (max-width: 991px){
body{ overflow-x:hidden;}
.Industry_plate .title{ width:100%;}
.plate{ width:100%;}
.plate .plate_list .plateBox{ width:50%; margin-bottom:20px;}
.platform{ padding:20px 0; height:auto;}
.platform ul li { border-width:5px;}
.platform ul li>div{ margin:0 10px;}
.plugs .plugList li.info{ width:25%;}

.theme1 .imgBox li{ display:none; width:50%;}
.theme1 .imgBox li:nth-child(1){ display:block;}
.theme1 .imgBox li:nth-child(2){ display:block;}
.partner .allbrand .brand>div{ width:25%;}

.case .case-cont{ margin-top:20px;}
.case .case-cont ul li{ width:50%;}

.wxd_plug .plug-list{ width:306px; height:306px}
.wxd_plug .plug-list li{ width:110px; height:110px;}
.wxd_plug .plug-list li:nth-child(1){ left:21px; top:21px;}
.wxd_plug .plug-list li:nth-child(2){ left:185px; top:21px;}
.wxd_plug .plug-list li:nth-child(3){ left:103px; top:103px;}
.wxd_plug .plug-list li:nth-child(4){ left:21px; top:185px;}
.wxd_plug .plug-list li:nth-child(5){ left:185px; top:185px;}
.wxd_plug .plug-list li:nth-child(6){ display:none;}
.wxd_plug .plug-list li:nth-child(7){ display:none;}

.vip_plugs{ padding:30px 0 40px;}
.wwdc15{}
.wwdc15 .content{ width:260px; height:260px;}
.wwdc15 .content h1{ font-size:22px; margin:38px auto 25px;}
.wwdc15 .content p{ font-size:12px; line-height:21px;}
.wwdc15 .content .more_btn{ font-size:12px; height:30px; line-height:30px; padding:0 10px;}

.wwdc15 span{ width:160px; height:160px; left: -webkit-calc(50% - 80px); left: calc(50% - 
80px); bottom: 50px;}
.wwdc15 .circle{ position: absolute; left: -webkit-calc(50% - 80px); left: calc(50% - 
80px); top: -webkit-calc(50% - 160px); top: calc(50% - 160px); -webkit-transform-origin: 
50% 160px; -ms-transform-origin: 50% 160px; transform-origin: 50% 160px;}
.wwdc15 span.small-shapes{ position:relative; width:100%; height:auto; animation:none; left:0; top:0; text-align:center; margin-bottom:30px;}
.wwdc15 span.small-shapes::after{content:''; position:relative; clear:both;}
.wwdc15 span.small-shapes .small { display:inline-block; margin:5px; position:relative; left:auto;top:auto; -webkit-transform-origin:0; -ms-transform-origin:0; transform-origin:0; transform:none; -webkit-transform:none;}
.wwdc15 span.small-shapes .seven{ display:none;}
.wwdc15 span.small-shapes .eight{ display:none;}
}
@media screen and (max-width: 767px){
.plate .plate_list .plateBox{ width:100%;}
.platform .title,.plugs .title,.case .title,.partner .title{ font-size:1em;}
.platform ul li { float:none; width:92%; border-width:5px;}
.platform ul li>div{ margin:0 10px;}
.platform ul li .title{ font-size:1em;}
.plugs .plugList li.info{ width:50%; display:block; float:left;}
.case{ padding:20px 0;}
.case .case-cont .line{ margin:15px 0;}
.case .case-cont .btn-box{ top:-25px; width:120px;}
.example-wrapper{ margin-top:15px;}
.theme1 .imgBox li{ display:none;}
.partner .allbrand .brand>div{ width:50%;}
.about{ height:630px; padding:20px 0;}
.about .text-box{ background-size:contain; background-position:center bottom; width:100%; margin:0; left:0; top:60px; padding:50px; height:600px;}
.about .text-box .a-contlist{ display:none;}
.case .case-cont ul li>div .QR-img{ padding:30px 0;}


}

@media screen and (max-width: 484px){
.case .case-cont ul li{ width:100%;}
}
@media screen and (max-width: 320px){
.platform{ padding:10px 0;}
.platform .btn-box>a{ width:100px;}
.about{ height:780px;}
.about .text-box{ height:750px;}

.case .case-cont{ margin-top:10px;}
}