.pagebox .banner#agency{height:0;padding-bottom:33%;}
.ping{display:block;max-width:100%;max-height:100%;min-height:100%;min-width:100%;}
.page-title{text-align:center;font-size:0;}
.page-title .main{font-size:16px;color:#333;}
.page-title .small{font-size:10px;color:#999;margin-top:6px;}
.page-title.white .main{color:#fff;}
.page-title.white .small{color:#fff;}
.first-main{margin-top:20px;margin-bottom:25px;}
.first-content{margin:20px 28px 0 28px;}
.first-content .top-group{margin-bottom:10px;}
.first-content .top-group .icon-box{background-color:#3887fa;}
.first-content .bottom-group .icon-box{background-color:#fab36a;}
.first-content .icon-box{width:57px;height:123px;box-sizing:border-box;position:relative;}
.first-content .icon-box .icon{height:19px;margin-bottom:5px;}
.first-content .icon-box .name{font-size:13px;color:#fff;}
.first-content .icon-box:after{content:'';display:block;width:40px;height:6px;box-sizing:border-box;border-style:solid;border-width:0 2px 2px 0;position:absolute;bottom:0;right:-40px;}
.first-content .icon-box:before{content:'';display:block;width:40px;height:6px;box-sizing:border-box;border-style:solid;border-width:2px 2px 0 0;position:absolute;top:0;right:-40px;}
.first-content .top-group .icon-box:after{border-color:#3887fa;}
.first-content .top-group .icon-box:before{border-color:#3887fa;}
.first-content .bottom-group .icon-box:after{border-color:#fab36a;}
.first-content .bottom-group .icon-box:before{border-color:#fab36a;}
.first-content .list-box{width:calc(100% - 68px);position:relative;z-index:2;}
.first-content .list-box .list{font-size:9px;color:#fff;margin-bottom:10px;border-radius:0 30px 30px 0;box-sizing:border-box;padding:5px 0 5px 7px;white-space:nowrap;}
.first-content .list-box .list:last-child{margin-bottom:0;}
.first-content .top-group .list-box .list{background-color:#3887fa;}
.first-content .bottom-group .list-box .list{background-color:#fab36a;}

.second-main{background-color:#1b1d2c;padding:20px 10px 15px 10px;}
.second-main .img-box{margin-top:15px;}

.third-main{margin:24px 0 20px 0;}
.third-content{margin:10px 10px 0 10px;}
.third-content .list{width:calc(50% - 5px);text-align:center;box-sizing:border-box;border:solid 1px #efefef;padding:20px 0 12px 0;margin-top:10px;}
.third-content .list .icon{height:25px;margin-bottom:10px;}
.third-content .list .name{font-size:13px;color:#333;margin-bottom:7px;}
.third-content .list .small{font-size:9px;color:#888;text-align:left;margin:0 10px;line-height:1.5;}

.fourth-main{background:url(../../images/single/mini_program_selling/page_bg.jpg) no-repeat top center;background-size:100% 100%;padding:20px 18px 23px 18px;}
.fourth-content{margin:20px 0 0 0;font-size:0;}
.fourth-content .list{box-sizing:border-box;margin-top:15px;}
.fourth-content .list .icon{width:32px;}
.fourth-content .list .text-box{width:calc(100% - 32px);box-sizing:border-box;padding-left:12px;}
.fourth-content .list .name{font-size:13px;color:#fff;margin-bottom:4px;}
.fourth-content .list .small{font-size:9px;color:#fff;line-height:1.5;}

.message{padding:1rem 0;background:#fff;}
.mestitle{text-align:center;}
.mestitle .titleh{font-size:.48rem;color:#333;}
.mestitle .contp{font-size:.36rem;color:#666;margin-top:.2rem;}
.formd{margin-top:.5rem;}
.formd form input{display:block;width:100%;box-sizing:border-box;}
.formd form .xmane,.formd form .iphone{position:relative;border:solid .02rem #f0f3fa;box-sizing:border-box;display:flex;align-items:center;}
.formd form .xmane input,.formd form .iphone input{padding:.36rem .2rem;padding-left:1rem;font-size:.36rem;}
.formd form .xmane:before{display:block;position:absolute;left:.3rem;content:'';background:url(../../images/xingming.png) no-repeat;width:.48rem;height:.48rem;background-size:100%;}
.formd form .iphone:before{display:block;position:absolute;left:.3rem;content:'';background:url(../../images/dianhua.png) no-repeat;width:.48rem;height:.48rem;background-size:100%;}
.formd form .submit{margin-top:.4rem;}
.formd form .submit input{display:block;width:100%;height:100%;text-align:center;padding:.3rem 0;background:#316fff;color:#fff;border:solid .02rem #316fff;font-size:.4rem;cursor:pointer;box-sizing:border-box;border-radius:60rem;}
.remarks{text-align:center;margin-top:.5rem;}
.remarks p.mainp{font-size:.4rem;color:#333;}
.remarks p.small{font-size:.38rem;color:#666;margin-top:.2rem;}

/*flex兼容写法*/
/* 定义 */
.flex-def {display: -webkit-flex; display: flex; }
/* 主轴居中 */
.flex-zCenter {-webkit-justify-content: center;justify-content: center;}
/* 主轴居中 */
.flex-zAround {-webkit-justify-content: space-around;justify-content: space-around;}
/* 主轴两端对齐 */
.flex-zBetween {-webkit-justify-content: space-between;justify-content: space-between;}
/* 主轴end对齐 */
.flex-zEnd {-webkit-justify-content: flex-end;justify-content: flex-end;}
/* 主轴start对齐 */
.flex-zStart {-webkit-justify-content: start;justify-content: start;}
/* 侧轴居中 */
.flex-cCenter {-webkit-align-items: center;align-items: center;}
/* 侧轴start对齐 */
.flex-cStart {-webkit-align-items: start;align-items: start;}
/* 侧轴底部对齐 */
.flex-cEnd {-webkit-align-items: flex-end;align-items: flex-end;}
/* 侧轴文本基线对齐 */
.flex-cBaseline {-webkit-align-items: baseline;align-items: baseline;}
/* 侧轴上下对齐并铺满 */
.flex-cStretch {-webkit-align-items: stretch;align-items: stretch;}
/* 主轴从上到下 */
.flex-zTopBottom {-webkit-flex-direction: column;flex-direction: column;}
/* 主轴从下到上 */
.flex-zBottomTop {-webkit-flex-direction: column-reverse;flex-direction: column-reverse;}
/* 主轴从左到右 */
.flex-zLeftRight {-webkit-flex-direction: row;flex-direction: row;}
/* 主轴从右到左 */
.flex-zRightLeft {-webkit-flex-direction: row-reverse;flex-direction: row-reverse;}
/* 是否允许子元素伸缩 */
.flex-item {-webkit-flex-grow: 1;flex-grow: 1;}
/*子元素换行*/
.flex-wrap {-moz-flex-wrap:wrap;flex-wrap:wrap;}
/* 子元素的显示次序 */
.flex-order{-webkit-order: 1;order: 1;}
/*元素比例*/
.flex-one{-webkit-flex: 1; flex: 1;}