input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none;}
input[type= "number"] {-moz-appearance: textfield;}
.box{width: 100%;max-width: 1024px;margin: 0 auto;}
.login-box{display: flex;height: 100%;min-height: 100vh;align-items: center;background: url(../images/bg.jpg) center no-repeat;background-size:100% 100%;}
.login-item{background-color: #F3F6F9;width: calc(100% - 80px);max-width: 400px;margin: 0 auto;padding: 20px 40px;height:auto;border-radius: 6px;}
.login-item h3{color: #009CFF;font-size: 24px;text-align: center;font-weight: 700;line-height: 1.2;padding: 10px 0;position: relative;}
.login-item h3 .close{position: absolute;top:0;right:0;color:#666;font-size:18px;cursor: pointer;}
.login-item .input{width: 100%;height: 50px;padding: 9px 0;position: relative;}
.login-item .input input{width: calc(100% - 20px);height: calc(100% - 20px);padding: 10px;font-weight: 400;line-height: 1.5;color: #757575;background-color: #fff;border: 1px solid #ced4da;border-radius: 5px;}
.login-item .input .code{position: absolute;top:9px;right:18px;line-height: 50px;cursor: pointer;color: #009CFF;z-index:9;}
.login-item .input .code.on{color:#999;cursor: default;}
.login-item .agreement{padding: 8px 0;margin-top: 10px;}
.login-item .btn{margin-top: 15px;}
.login-item .tps{text-align: center;padding: 20px 0;}
.login-item a{color: #009CFF;}
.login-item a:hover{color: #007dcc;}
.layui-form-checked[lay-skin=primary] i{border-color: #1e9fff!important;background-color: #1e9fff!important;}
.layui-form-checkbox[lay-skin=primary]:hover i {border-color: #1e9fff;}

.head{background: #393d49;border-bottom: 5px solid #5FB878;}
.head .layui-nav-bar{display: none;}
.head .logo a{font-size: 20px;color:#fff;}
.head .logo::after{display: none;}
.main-box{display: flex;background: #f2f2f2;}
.main-box .left-box{width: 100px;background: #393d49;height: calc(100vh - 65px);}
.main-box .left-box .layui-nav-tree{width: 100px;}
.main-box .left-box .layui-nav-tree .layui-nav-child dd.layui-this,.main-box .left-box .layui-nav-tree .layui-nav-child dd.layui-this a,.main-box .left-box .layui-nav-tree .layui-this,.main-box .left-box .layui-nav-tree .layui-this>a,.main-box .left-box .layui-nav-tree .layui-this>a:hover{background-color: #4a5060;}
.main-box .right-box{margin: 15px;padding: 15px;background: #fff;border-radius: 4px;flex: 1;overflow-y: auto;height: calc(100vh - 125px);}
.main-box .right-box h3{font-weight: 500;border-bottom: 1px solid #f5f5f5;padding-bottom: 10px;}
.apply-box{padding: 0 5px;padding-top: 20px;}
.apply-box .apply-li{position: relative;width: 100%;height: 123px;display: flex;justify-content: space-between;flex-direction: column;min-width: 0;word-wrap: break-word;background-color: #fff;background-clip: border-box;border-radius: 4px;box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,0.15);transition: all .2s linear;}
.apply-box .apply-li:hover{box-shadow: 0px 2px 5px 5px rgb(239 18 18 / 15%);}
.apply-box .apply-li .info{display: flex;padding: 10px;align-items: center;height: 80px;}
.apply-box .apply-li .info .left{width: 80px;text-align: center;}
.apply-box .apply-li .info .right{flex: 1;}
.apply-box .apply-li .info .right h4{font-weight: 700;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 18px;line-height: 1.2;color: #4d5259;}
.apply-box .apply-li .info .right p{overflow: hidden;-webkit-line-clamp: 2;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;color: #858796;font-size:14px;padding-top: 5px;}
.apply-box .apply-li .bottom{display: flex;justify-content: space-between;padding: 0 10px;padding-bottom: 10px;}
.apply-box .apply-li .bottom .left span{display: inline-block;border-radius: 4px;margin-right: 5px;color: rgb(21, 195, 119);background-color: rgba(21, 195, 119, 0.1);padding: 3px 6px;font-size: 12px;}
.apply-box .apply-li .bottom .left .t2{color: rgb(255 0 0);background-color: rgb(255 0 0 / 10%);}
.apply-box .apply-li .bottom .left .t3{color: rgb(0 196 255);background-color: rgb(40 136 255 / 16%);}
.apply-box .apply-li .bottom .left .t4{color: rgb(255 0 235);background-color: rgb(248 76 251 / 16%);}
.apply-box .apply-li .bottom .left .t5{color: rgb(255, 111, 0);background-color: rgba(255, 111, 0, 0.1);}
.apply-box .apply-li .bottom .right{color: #00a1ff;}

.api_index{width: 100%;background: #fff;min-width: 1380px;}
.api_index .body-box{width: 1360px;margin: 0 auto;padding: 0 10px;}
/*首页*/
.api_index .banner{width: 100%;height: 600px;background-image: url(/packs/images/city_screen.jpg);background-size: cover;background-position: center;background-repeat: no-repeat;}
.api_index .banner .top{height: 66px;display: flex;justify-content: space-between;align-items: center;padding: 0 32px;}
.api_index .banner .top .logo{width: 162px;height: 34px;}
.api_index .banner .top .right{display: flex;justify-content: flex-start;align-items: center;}
.api_index .banner .top .right .menu{margin-right: 30px;}
.api_index .banner .top .right .menu .nav{display: inline-block;line-height: 34px;padding: 0 10px;color: #eee;margin: 0 6px;font-size: 14px;border: 1px solid rgba(0,0,0,0);transition: all 300ms linear;}
.api_index .banner .top .right .menu .nav:hover{border: 1px solid #ccc;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.api_index .banner .top .right .logbox a{width: 68px;height: 33px;margin: 0 5px;font-size: 12px;display: inline-block;text-align: center;line-height: 33px;color: #fff;}
.api_index .banner .top .right .logbox a.on{background-color: #3dd18f;border-color: #29af73;
    border-radius: 3px;
    transition: all 300ms linear;}
.api_index .banner .top .right .logbox a.on:hover{opacity: 0.8;}
.api_index .banner .columns{width: 100%;text-align: center;color: #fff;height: 534px;align-items: center;display: flex;flex-direction: column;justify-content: center;}
.api_index .banner .columns h1{font-size: 26px;padding-bottom: 26px;}
.api_index .banner .columns h2{font-size: 20px;padding-bottom: 26px;}
.api_index .banner .columns .btn{color: #3e4d60;cursor: auto;font-family: PingFang SC,Microsoft Yahei,Hiragino Sans GB,Microsoft Sans Serif,sans;font-style: normal;font-weight: 400;line-height: 150%;}
.api_index .banner .columns .btn a{
    -webkit-appearance: none;-moz-appearance: none;border-radius: 0;border-style: solid;border-width: 0;cursor: pointer;font-family: PingFang SC,Microsoft Yahei,Hiragino Sans GB,Microsoft Sans Serif,sans;font-weight: normal;line-height: normal;margin: 0 0 0;position: relative;text-align: center;text-decoration: none;display: inline-block;padding: 12px 30px;font-size: 14px;background-color: #578cff;border-color: #135dff;color: #fff;transition: background-color 300ms ease-out;border-radius: 1000px;margin: 0 10px;}
.api_index .banner .columns .btn a.on{background-color: #3dd18f;border-color: #29af73;}
.api_index .product{background: #fff;padding-top: 50px;padding-bottom: 50px;}
.api_index .product .title{font-size: 32px;color: #333;text-align: center;padding-bottom: 50px;}
.api_index .product .product-box{display: flex;align-items: center;justify-content: space-around;padding-top: 50px;}
.api_index .product .product-box .span h2{font-size: 30px;color: #38344C;margin-bottom: 20px;}
.api_index .product .product-box .span p{color: gray;font-size: 15px;line-height: 30px;}

.api_index .superiority{width: 100%;background: #f5f6fa;}
.api_index .superiority .title{font-size: 32px;color: #333;padding-top: 40px;padding-bottom: 20px;text-align: center;}
.api_index .superiority ul{margin-top: 50px;margin-bottom: 20px;width: 100%;display: flex;justify-content: flex-start;flex-wrap: wrap;}
.api_index .superiority ul li{width: 33.333%;display: flex;justify-content: space-between;}
.api_index .superiority ul li .icon{width: 32px;height: 32px;margin-right: 10px;}
.api_index .superiority ul li .icon img{width: 100%;height: 100%;}
.api_index .superiority ul li .info{width: calc(100% - 62px);padding-right: 30px;}
.api_index .superiority ul li .info .h1{font-size: 24px;color: #333;margin-bottom: 20px;}
.api_index .superiority ul li .info .text{font-size: 12px;line-height: 1.5;color: #333;padding-bottom: 40px;}
.api_index .clientele{background: #fff;padding-top: 30px;padding-bottom: 50px;}
.api_index .clientele .title{font-size: 32px;color: #333;padding-top: 40px;padding-bottom: 20px;text-align: center;}
.api_index .clientele .img{width: 100%;height: 406px;}
.api_index .clientele .img img{width: 100%;}
.api_index .footer{padding: 80px 0;background: #3e4d60;color: #fff;}
.api_index .footer .body-box{position: relative;}
.api_index .footer .nav{padding-bottom: 30px;}
.api_index .footer .nav a{margin-right: 20px;color: #fff;font-size: 12px;}
.api_index .footer .text{color: #ccc;width: 100%;display: flex;justify-content: space-between;}
.api_index .footer .text a{color: #fff;}
.api_index .footer .btlogo{position: absolute;top: 0;right: 0;width: 190px;height: 20px;}
.api_index .footer .btlogo img{width: 100%;height: 100%;}


/*用户详情*/
.user-index .left .info{background: #f1f1f9;display: flex;justify-content: center;flex-direction: column;flex-wrap: wrap;font-size: 20px;padding: 19px;box-sizing: border-box;line-height: 1.6;}
.user-index .left .info .balance .rmb{color: #f00;}
.user-index .left .info .balance .pay{color: #009688;cursor: pointer;}
.user-index .chat-box{background: #f1f1f1;padding: 10px;}
.user-index .chat-box h3{font-size:18px;}
/*产品余额*/
.user-index .left .productnum{width: 100%;padding-top: 20px;display: flex;justify-content: space-between;flex-wrap: wrap;}
.user-index .left .productnum .li{width: 100%;display: flex;justify-content: space-between;align-content: center;font-size: 16px;border-bottom: 1px solid #f1f1f1;line-height: 40px;}
.user-index .left .productnum .li .num{font-size: 15px;color: #f00;}
.user-index .left .productnum .li .num span{color: #009688;padding-left: 10px;cursor: pointer;}
/*消费统计*/
.user-index .left .consumebox{margin-top: 20px;width: 100%;}
.user-index .left .consumebox .title{width: 100%;display: flex;justify-content: space-between;color: #fff;background: #5FB878;font-size: 18px;line-height: 40px;}
.user-index .left .consumebox .title .ta{border-right: 1px solid #fff;}
.user-index .left .consumebox .title .ta:nth-child(3){border-right: 0;}
.user-index .left .consumebox ul li{width: 100%;display: flex;justify-content: space-between;color: #333;font-size: 16px;line-height: 40px;border-bottom: 1px solid #5FB878;}
.user-index .left .consumebox .ta{text-align: center;border-left: 1px solid #5FB878;padding: 0 6px;}
.user-index .left .consumebox .ta:nth-child(1){width: 20%;}
.user-index .left .consumebox .ta:nth-child(2){width: 65%;text-align: left;}
.user-index .left .consumebox .ta:nth-child(3){border-right: 1px solid #5FB878;width: 15%;}

/*统计*/
.user-index .right .statistics{width: 100%;background: #f1f1f1;transition: all .2s linear;padding: 20px;box-sizing: border-box;}
.user-index .right .statistics .name{font-size: 20px;}
.user-index .right .statistics .unm{font-size: 20px;padding-top: 10px;}
.user-index .right .statistics .unm span{padding-left: 4px;color: #5FB878;}
/*产品列表*/
.apply-box .apply-li{position: relative;}
.apply-box .apply-li .shade{width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: rgba(0,0,0,0.6);display: flex;justify-content: center;align-items: center;border-radius: 4px;display: none;}
.apply-box .apply-li .shade a{padding: 0 15px;line-height: 40px;border: 1px solid #fff;color: #fff;font-size: 16px;border-radius: 4px;margin-right: 25px;display: inline-block;}
.apply-box .apply-li .shade a.on{background: #5FB878;border: 1px solid #5FB878;}
.apply-box .apply-li .shade a:nth-child(2){margin-right: 0;}
.apply-box .apply-li:hover .shade{display: inline-flex;}
/*购买套餐*/
.setmealbox{width: 900px;position: relative;padding: 20px;box-sizing: border-box;padding-top: 0;overflow-y: auto;max-height: 74vh;}
.setmealbox .title{font-size: 18px;color: #333;font-weight: 600;padding: 20px 0;}
.setmealbox .list li{background: #fff;border: 1px solid rgba(95,184,120,0.4);padding: 15px;position: relative;cursor: pointer;overflow: hidden;transition: all .2s linear;color: #111;}
.setmealbox .list li .name{font-size: 18px;font-weight: 600;}
.setmealbox .list li .text{font-size: 14px;color: #999;}
.setmealbox .list li .price{font-size: 20px;color: #f00;padding-top: 10px;}
.setmealbox .list li .price span{font-size: 14px;padding-left: 2px;}
.setmealbox .list li .limited{position: absolute;top: 0;right: 0;color: #fff;background: #f00;font-size: 12px;padding: 4px 10px;}
.setmealbox .list li.on{border: 1px solid rgba(95,184,120,1);border-radius: 8px;color: #fff;background: rgba(95,184,120,1);}
.setmealbox .list li.on .price{color: #fff;}
.setmealbox .list li.on .text{color: #fff;}
.setmealbox .list li:hover{border: 1px solid rgba(95,184,120,1);border-radius: 8px;color: #fff;background: rgba(95,184,120,1);}
.setmealbox .list li:hover .price{color: #fff;}
.setmealbox .list li:hover .text{color: #fff;}
.setmealbox .payment{width: 100%;display: flex;justify-content: flex-start;}
.setmealbox .payment .pay{line-height: 35px;font-size: 16px;padding: 0 25px;background: #f60;color: #fff;margin-right: 15px;border-radius: 4px;cursor: pointer;}
.setmealbox .payment .pay.zhifubao{background: #298DFF;}
.setmealbox .payment .pay.wexin{background: #00C80A;}
.setmealbox .hint{padding-top: 15px;font-size: 14px;color: #999;}
/*秘钥管理*/
.secret-box .hint{width: 100%;padding: 20px;padding-bottom: 10px;box-sizing: border-box;background: rgba(95,184,120,.4);display: flex;justify-content: flex-start;}
.secret-box .hint .icon{padding-right: 10px;font-size: 16px;font-weight: 600;color: #007143;}
.secret-box .hint .text p{padding-bottom: 10px;color: #007143;}
.secret-box .secretpass{width: auto;padding: 0 15px;background: #f1f1f1;color: #333;line-height: 40px;}
.secret-box .secretpass .pass{color: #111;}
.secret-box .secretpass .apikey-show{padding: 5px 10px;color: #288abb;cursor: pointer;}
.secret-box .secretpass .btn{padding: 6px 15px;background: #5FB878;color: #fff;margin-left: 5px;font-size: 12px;cursor: pointer;}
.secret-box .addkeu{margin-top: 20px;padding: 0 25px;color: #fff;background: #5a9bfb;line-height: 40px;display: inline-block;cursor: pointer;transition: all .2s linear;}
.secret-box .addkeu:hover{opacity: 0.8;}
.site-mobile-shade{content: '';position: fixed;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(0,0,0,.2);z-index: 998;display: none;}
.site-tree-mobile{display: none;position: fixed;z-index: 998;bottom: 15px;left: 15px;width: 50px;height: 50px;line-height: 50px;border-radius: 2px;text-align: center;background-color: #009688;color: #fff;}
.telcode-pop{position: fixed;top:0;left:0;display:none;background: rgba(0,0,0,.4);width:100%;height:100%;z-index:999;}
.telcode-pop .login-item{position: absolute;top:50%;left:50%;transform: translate(-50%, -50%);}

@media screen and (max-width: 920px){
	.setmealbox {width: 100%;}
}
@media screen and (max-width: 992px){
	.main-box .left-box{position: fixed;top:65px;left:-150px;z-index: 999;}
	.user-index .right .statistics .name{font-size: 16px;}
	.site-tree-mobile{display: block;}
	.user-index .left .info{font-size: 16px;}
	.user-index .left .consumebox .ta:nth-child(1) {width: 32%;}
	.user-index .left .consumebox .ta:nth-child(2) {width: 53%;}
}