@charset "utf-8";


.rebinding-box{margin-top: 30px;}
.rebinding-box .box-timeline{width: 100%;  text-align: center;}
.rebinding-box .box-timeline ul{ display: flex;  justify-content: center; width: 100%;}
.rebinding-box .box-timeline ul li{font-size: 14px;color: #999;width: 80px; position: relative; margin: 0 20px;}
.rebinding-box .box-timeline .outside1ab{width: 38px; height: 38px; background-color: #d7d7d7; border-radius: 50%;line-height: 38px; margin: 10px auto; display:flex; display: -webkit-flex;  align-items:center;}
.rebinding-box .box-timeline .outside2ab{width: 38px; height: 38px; background-color: #d7d7d7; border-radius: 50%;line-height: 38px; margin: 10px auto; display:flex; display: -webkit-flex;  align-items:center;}
.rebinding-box .box-timeline .outside3a{width: 38px; height: 38px; background-color: #d7d7d7; border-radius: 50%;line-height: 38px; margin: 10px auto; display:flex; display: -webkit-flex;  align-items:center;}
.rebinding-box .box-timeline .outside1ab:before{content:"";position:absolute; height: 1px; width: 40px;background-color: #d7d7d7;top: 48px;right: 71px;z-index: 2;}
.rebinding-box .box-timeline .outside1ab:after{content:"";position:absolute; height: 1px; width: 40px;background-color: #d7d7d7;top: 48px;left: 71px;z-index: 2;}
.rebinding-box .box-timeline .outside2ab:before {
	content: "";
	position: absolute;
	height: 1px;
	width: 40px;
	background-color: #d7d7d7;
	top: 48px;
	right: 71px;
	z-index: 2;
}

.rebinding-box .box-timeline .outside2ab:after {
	content: "";
	position: absolute;
	height: 1px;
	width: 40px;
	background-color: #d7d7d7;
	top: 48px;
	left: 71px;
	z-index: 2;
}

.rebinding-box .box-timeline .outside2ab:before{content:"";position:absolute; height: 1px; width: 40px;background-color: #d7d7d7;top: 48px;right: 71px;z-index: 2;}
.rebinding-box .box-timeline .outside3a:before{content:"";position:absolute; height: 1px; width: 40px;background-color: #d7d7d7;top: 48px;right: 71px;z-index: 2;}
.rebinding-box .box-timeline  div[class*=box-num]{width: 26px; height: 26px;line-height: 26px; margin: 14px auto; border-radius: 50%; background-color: #288dff;color: #fff; }
/*.rebinding-box .box-timeline  div[class*=box-nums]:after{content: ""; position:absolute; height: 1px; width: 40px;background-color: #288dff;top: 46px;left: 71px;}*/
.rebinding-box .box-timeline .outside1ab .num2ab{background-color: #999;}
.rebinding-box .box-timeline .outside2ab .num3ab{background-color: #999;}
.rebinding-box .box-timeline .outside2ab .num3a{background-color: #999;}
.rebinding-box .box-timeline .outside3a .num4a{background-color: #999;}
.rebinding-box .box-timeline ul .box-num1{background-color: #288dff;}
.rebinding-box .box-timeline .box-num2,.rebinding-box .box-timeline .box-num3,.rebinding-box .box-timeline .box-num4{margin-left: 45px;}
.rebinding-box .box-timeline .box-num1:after{content:"";position:absolute; height: 1px; width: 40px;background-color: #288dff;top: 48px;left: 71px;}
.rebinding-box .box-timeline .num2ab:before{content:"";position:absolute; height: 1px; width: 40px;background-color: #288dff;top: 48px;right: 71px;}
.rebinding-box .box-timeline .num2ab:after{content:"";position:absolute; height: 1px; width: 40;background-color: #288dff;top: 48px;left: 71px;}
    .rebinding-box .box-timeline .num3ab:before {
        content: "";
        position: absolute;
        height: 1px;
        width:40px;
        background-color: #288dff;
        top: 48px;
        right: 71px;
    }

    .rebinding-box .box-timeline .num3ab:after {
        content: "";
        position: absolute;
        height: 1px;
        width: 40px;
        background-color: #288dff;
        top: 48px;
        left: 71px;
    }

.rebinding-box .box-timeline .num4a:before{content:"";position:absolute; height: 1px; width: 40px;background-color: #288dff;top: 48px;right: 71px;}
/*第一步*/
.rebinding-box  div[class*=box-form] {width: 300px;margin: 30px auto 0 auto;}
.rebinding-box  .twobox-form{display: none;}
.rebinding-box  .threebox-form{display: none;}
.rebinding-box  .fourbox-form{display: none;}
.rebinding-box .onebox-form{ width: 100%;}
.rebinding-box .oneform-box{display: flex;align-items: center;width: 100%; flex-wrap: wrap;}
.rebinding-box .onebox-form .oneform-label{display: block;width:70px; font-size: 14px;}
.rebinding-box .onebox-form .oneform-input{width:calc(100% - 70px);}
.rebinding-box .onebox-form .oneform-input input {
	outline:none;
	appearance:none;
	-moz-appearance:none;
	-webkit-appearance:none;
	-ms-appearance:none;
	padding: 0;
	margin: 0;
	background: none;
	border: 1px #ddd solid;
	display: block;
	height: 40px;
	width: 100%;
	box-sizing: border-box;
	padding: 0 10px;
	border-radius: 6px;
}
.rebinding-box .onebox-form .oneform-input input::-webkit-input-placeholder{font-size: 14px;color: #999;}
.rebinding-box .onebox-form .oneform-input input:focus{border: 1px #288dff solid;}
.rebinding-box .onebox-form .onebtn-box{width: 130px;height: 40px; margin:30px auto;}
.rebinding-box .onebox-form .onebtn-box .onebtn{width: 130px;height: 40px; margin: 0 auto;background-color: #288dff;color: #fff;border-radius: 6px;font-size: 14px;}
/*第二步*/
.rebinding-box .twoform-box{width: 100%;}
.rebinding-box .twoform-box .wen{display: flex; align-items: center; justify-content: space-between;flex-wrap: wrap;}
.rebinding-box .twoform-box .da{display: flex; align-items: center; justify-content: space-between; margin-top: 10px; flex-wrap: wrap;}
.rebinding-box .twobox-form label{display: block;width: 70px; font-size: 14px;}
.rebinding-box .twobox-form .twoform-input{width:calc(100% - 70px);}
.rebinding-box .twobox-form input{
	outline:none;
	appearance:none;
	-moz-appearance:none;
	-webkit-appearance:none;
	-ms-appearance:none;
	padding: 0;
	margin: 0;
	background: none;
	border: 1px #ddd solid;
	display: block;
	height: 40px;
	width: 100%;
	box-sizing: border-box;
	padding: 0 10px;
	border-radius: 6px;
}
.rebinding-box .twobox-form input:focus{border: 1px #288dff solid;}
.rebinding-box .twobox-form  .twobtn-box{width: 130px;height: 40px; margin: 30px auto;}
.rebinding-box .twobox-form  .twobtn-box .twobtn{width: 130px;height: 40px;background-color: #288dff;color: #fff;border-radius: 6px;font-size: 14px;}


.c-mibao-select{
	width: calc(100% - 70px);
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: relative;
	cursor: pointer;
	border: 1px #ddd solid;
	box-sizing: border-box;
	padding: 0 10px;
	border-radius: 6px;
	
}
.c-mibao-select.open{border: 1px #288dff solid;}
.c-mibao-select::after{
	content: "\eb87";
	display: block;
	font-size: 12px;
	top: 50%;
	transform: translateY(-50%);
	right:10px;
	position: absolute;
	color: #999;
}
.c-mibao-select p{
	width: 100%;
	height: 100%;
	font-size: 14px;
	color: #666;
	display: flex;
	align-items: center;
}
.c-mibao-select ul{
	width: 100%;
	display: block;
	font-size: 14px;
	background: #FFFFFF;
	position: absolute;
	top: 50px;
	left: 0px;
	display: none;
	overflow: hidden;
	box-shadow: 0 0 10px rgba(0,0,0,.1);
}
.c-mibao-select ul li{
	width: 100%;
	height: 36px;
	line-height: 36px;
	padding: 0px 15px;
	list-style: none;
	color: #000;
}
.c-mibao-select ul li.Selected{
	background: #288dff;
	color: #FFFFFF;
}
.c-mibao-select ul li:hover{
	background: #D0D0D0;
}

.c-mibao-select.open ul{
	max-height: 250px;
	display: block;
	overflow-y: auto;
}
.c-mibao-select.open::after{
	content: "\eb88";	
}


/*第三步*/


.rebinding-box .threebox-form .newtel {
    display: flex;align-items: center; justify-content: space-between;flex-wrap: wrap;
}
.rebinding-box .threebox-form .validatecode {
    display: flex;align-items: center; justify-content: space-between;margin-top: 10px;flex-wrap: wrap;
}
.rebinding-box .threebox-form .threeform-input3{width: calc(100% - 70px);}

.rebinding-box .threebox-form .threebtn-box {
    width: 130px;
    height: 40px;
    margin: 30px auto;
}

.rebinding-box .threebox-form .threebtn-box .threebtn {
	width: 130px;
	height: 40px;
	background-color: #288dff;
	color: #fff;
	border-radius: 6px;
	font-size: 14px;
}


/*第四步*/
.rebinding-box .fourbox-form .successr .symbol{width: 66px;height: 66px;border: solid 4px #288dff;border-radius:50%;position: relative;margin: 0 auto;}
.rebinding-box .fourbox-form .successr .symbol:before{position: absolute; content: " ";width:36px; height:19px;border-left:4px solid #288dff; border-bottom: 4px solid #288dff;top: 12px;left: 10px;transform:rotate(-46deg);}
.rebinding-box .fourbox-form .successr p{font-size: 18px;text-align: center;margin-top: 15px;}


.rebinding-box .fourbox-form .fourbtn-box {
    width: 130px;
    height: 40px;
    margin: 30px auto;
}

.rebinding-box .fourbox-form .fourbtn-box .fourbtn {
	width: 130px;
	height: 40px;
	background-color: #288dff;
	color: #fff;
	border-radius: 6px;
	font-size: 14px;
}


/* 扩展*/
#timer1{
    color:red;
}
.sendtimer {
    display:none;
    float: right;
    width: 35%;
    margin-top: -30px;
}