/*TODO 登陆注册 模态框*/
/************************/
/*TODO 占位符*/
.input_box .plac_label{
    position: relative;
}
.input_box .plac_label b.placeholder{
    display: inline-block;
    pointer-events: none;
    position: absolute;
    left:23px;
    -webkit-transition: transform 250ms ease;
    -moz-transition: transform 250ms ease;
    -ms-transition: transform 250ms ease;
    -o-transition: transform 250ms ease;
    transition: transform 250ms ease;
}
.input_box .plac_label.filled b.placeholder{ width: 150px; text-align: right;}
.input_box .plac_label.filled b.placeholder,
.input_box .plac_label.filled b.placeholder.p_s_w,
.input_box .plac_label.filled b.placeholder.p_e,
.input_box .plac_label.filled b.placeholder.p_e_m,
.input_box .plac_label.filled b.placeholder.p_c,
.input_box .plac_label.filled b.placeholder.p_n_p
{
    -webkit-transform: translate(-100%, 0) translate(-40px,0);
    -moz-transform: translate(-100%, 0) translate(-40px,0);
    -ms-transform: translate(-100%, 0) translate(-40px,0);
    -o-transform: translate(-100%, 0) translate(-40px,0);
    transform: translate(-100%, 0) translate(-40px,0);
}
/*
.input_box .plac_label.filled b.placeholder.p_s_w{
    -webkit-transform:translate(-123%,0) translate(-20px,0);
    -moz-transform: translate(-123%,0) translate(-20px,0);
    -ms-transform: translate(-123%,0) translate(-20px,0);
    -o-transform: translate(-123%,0) translate(-20px,0);
    transform: translate(-123%,0) translate(-20px,0);
}
.input_box .plac_label.filled b.placeholder.p_e{
    -webkit-transform: translate(-135%, 0) translate(-20px, 0);
    -moz-transform: translate(-135%, 0) translate(-20px, 0);
    -ms-transform: translate(-135%, 0) translate(-20px, 0);
    -o-transform: translate(-135%, 0) translate(-20px, 0);
    transform: translate(-135%, 0) translate(-20px, 0);
}
.input_box .plac_label.filled b.placeholder.p_e_m{
    -webkit-transform: translate(-113%, 0) translate(-20px, 0);
    -moz-transform: translate(-113%, 0) translate(-20px, 0);
    -ms-transform: translate(-113%, 0) translate(-20px, 0);
    -o-transform: translate(-113%, 0) translate(-20px, 0);
    transform: translate(-113%, 0) translate(-20px, 0);
}
.input_box .plac_label.filled b.placeholder.p_c{
    -webkit-transform: translate(-118%, 0) translate(-20px, 0);
    -moz-transform: translate(-118%, 0) translate(-20px, 0);
    -ms-transform: translate(-118%, 0) translate(-20px, 0);
    -o-transform: translate(-118%, 0) translate(-20px, 0);
    transform: translate(-118%, 0) translate(-20px, 0);
}
.input_box .plac_label.filled b.placeholder.p_n_p{
    -webkit-transform: translate(-129%, 0) translate(-20px, 0);
    -moz-transform: translate(-129%, 0) translate(-20px, 0);
    -ms-transform: translate(-129%, 0) translate(-20px, 0);
    -o-transform: translate(-129%, 0) translate(-20px, 0);
    transform: translate(-129%, 0) translate(-20px, 0);
}
*/

.modal.login_modal_b {
    background-color: rgba(0, 0, 0, .5);
    display: block;
}
.modal.login_modal_b{
    position: fixed;
    top: 0;
    right: -20px;
    bottom: 0;
    left: 0;
    z-index: 1050000;
    overflow-y: scroll;
    outline: 0;
}
.modal .rotate_box_container{
    width:800px;
    height:700px;
    margin: 100px 0;
    position: absolute;
    left:50%;
    top:50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.modal .modal-container{
    position: absolute;
    left:0;
    top:0;
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
}
.rotate_box_container {
    -webkit-perspective: 2500px;
    -moz-perspective: 2500px;
    -ms-perspective:2500px;
    -o-perspective:2500px;
    perspective: 2500px;
    width:750px;
    height:700px;
}
.rotate_box_container.hover .rotate_box {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.container1, .container2 {
    display: block;
}
.rotate_box {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: .8s ease-in-out;
    -moz-transition: .8s ease-in-out;
    -ms-transition: .8s ease-in-out;
    -o-transition: .8s ease-in-out;
    transition: .8s ease-in-out;
    position: relative;
}

.modal.login_modal_b .modal-container {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
}

.modal .modal-container.container1 {
    z-index: 2;
}

.modal .modal-container.container2 {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

/*TODO 登录模块-综合*/
.modal .modal-container{
    width:780px;
    height:630px;
    background: url(../images/register/bk_03.png) no-repeat center center;
    background-size: cover;
    border-radius:0;
    overflow: hidden;
}
.modal .modal-container .close_btn{
    font-size: 16px;
    color:#fff;
    position: absolute;
    top:30px;
    right:30px;
    cursor: pointer;
    opacity: .6;
    -webkit-transition: all 200ms;
    -moz-transition: all 200ms;
    -ms-transition: all 200ms;
    -o-transition: all 200ms;
    transition: all 200ms;
}
.modal .modal-container.container2 .close_btn{
    color:#f89b38;
}
.modal .modal-container .close_btn:hover{
    opacity: 1;
}
.modal .modal-container.active{
    display: block;
}
/*TODO 注册模块-综合*/
.modal .modal-container.container2{
    background: url(../images/register/bk_register_03.jpg) no-repeat center center;
    background-size:cover;
    height:700px;
}
.modal .modal-container .modal-box{
    width:600px;
    min-height:300px;
    text-align: center;
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.modal .modal-container .modal-box.active{
    display: block;
}
.input_box{
    width: 360px;
    margin: 0 auto;
}

/*登录主页面*/
.modal-box .title p{
    font-size: 28px;
    color:#fff;
    line-height: 40px;
    text-align: center;
    margin-bottom: 0;
}
.modal-box .title h4{
    font-size:12px;
    line-height: 20px;
    margin-top:0;
}
.modal-box .title h4 .no_info{
    color:rgba(255,255,255,.6);
}
.modal-box .title h4 .click_reg{
    color:#fff;
    text-decoration: underline;
    cursor: pointer;
}
/*账号登录*/
.box1{

}
/*忘记密码*/
.box2{

}
/*学号登录*/
.box4{

}
.box1 .log_choose{
    width:360px;
    height:75px;
    margin:20px auto 50px;
    border-bottom:1px solid rgba(255,255,255,.4);
}
.box1 .log_choose{
    position: relative;
}
.box1 .log_choose>span{
    padding:0 10px;
    line-height: 20px;
    font-size:12px;
    color:rgba(255,255,255,.6);
    background-color: #f89b38;
}
.box1 .log_choose .third{
    position: absolute;
    top:-10px;
    left:50%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.box1 .log_choose .phone{
    position: absolute;
    bottom:-10px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.box1 .log_choose .choose i{
    display: inline-block;
    font-size: 30px;
    color:rgba(255,255,255,.6);
    margin-top:22px;
    cursor: pointer;
}
.box1 .log_choose .choose a{
    margin-right:40px;
    cursor: pointer;
}
.box1 .log_choose .choose a:last-child{
    margin-right:0;
    cursor: pointer;
}
.box1 .log_choose .choose i:hover{
    color:rgba(255,255,255,1);
}
/*选择学校输入框*/
.input_box input,.input_box .select{
    width:360px;
    height:40px;
    line-height: 40px;
    font-size:14px;
    color:rgba(255,255,255,.6);
    padding:0 20px;
    box-sizing: border-box;
    border:1px solid rgba(255,255,255,.6);
    background-color: rgba(255,255,255,.1);
    border-radius:20px;
    outline: none;
    margin-bottom:20px;
}

.input_box .pwd_info{
    position: relative;
}
.input_box .pwd_info input{
    padding-right:40px;
}
.input_box .pwd_info span{
    color: rgba(255,255,255,.6);
    font-size:16px;
    position: absolute;
    right: 20px;
    top: 10px;
    cursor: pointer;
}

/*TODO H5的input的placeholder样式*/
.modal.login_modal_b input::-webkit-input-placeholder,
.modal.login_modal_b input:-moz-placeholder,
.modal.login_modal_b input::-moz-placeholder,
.modal.login_modal_b input:-ms-input-placeholder{
    color: rgba(255,255,255,.6);
}

/*效果*/
.input_box input.eff:focus{
    color:rgba(255,255,255,1);
    border:1px solid rgba(255,255,255,1);
    background-color: rgba(255,255,255,.2);
}

/*Bootstrap样式重写*/
/*.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
    color:rgba(255,255,255,1);
    background-color: rgba(255,255,255,.2);
    border:1px solid rgba(255,255,255,1);
    -webkit-box-shadow: 0 0 0 ;
    -moz-box-shadow: 0 0 0;
    box-shadow: 0 0 0;
}*/
.ui-widget input{
    font-family: "Microsoft YaHei";
    font-size:14px;
}
.input_box .dropdown-menu{
    width:262px;
    margin-top:-21.5px;
    border-bottom-left-radius:15px;
    border-bottom-right-radius:15px;
}
.input_box .dropdown-menu li{
    height:30px;
    line-height: 30px;
    padding:0 10px;
    box-sizing: border-box;
}
.input_box .dropdown-menu li:hover,.input_box .dropdown-menu li:active{
    background-color: rgba(248,155,56,.7);
    cursor: pointer;
}

.input_box .login input{
    margin-top:10px;
    font-size:18px;
    letter-spacing:16px;
    text-indent: 16px;
    color:#fff;
    background: linear-gradient(to bottom,#f88038,#f66b0f);
    background: -webkit-linear-gradient(to bottom,#f88038,#f66b0f);
    -webkit-box-shadow: inset 0 1px rgba(255, 255, 255,.3);
    -moz-box-shadow: inset 0 1px rgba(255, 255, 255,.3);
    box-shadow: inset 0 1px rgba(255, 255, 255,.3);
    border:1px solid #e47b0c;
}
.input_box .login input:hover,
.input_box .login input:focus{
    background: linear-gradient(bottom,#f88c34,#f66f15);
    background: -webkit-linear-gradient(bottom,#f88c34,#f66f15);
}
.input_box>div{
    position: relative;
}
.input_box b{
    font-size:14px;
    position: absolute;
    left:23px;
    top:10px;
    color:rgba(255,255,255,.6);
    z-index: -1;
}
.input_box div.sub_title{
    position: relative;
    top:-5px;
}
.input_box div.sub_title span, .input_box div.sub_title a {
    color:#fff;
    font-size:14px;
    line-height: 30px;
    margin-right:130px;
    cursor: pointer;
}
.input_box div.sub_title span:last-child{
    margin-right: 0;
}

/*TODO 第二个页面-忘记密码-手机号*/
.box2 .title .click_login{
    color:#fff;
    text-decoration: underline;
    cursor: pointer;
}
.box2 .selec_toggle{
    margin-top:40px;
    margin-bottom:20px;
}
.box2 .selec_toggle span{
    cursor: pointer;
}
.box2 .selec_toggle span:first-child{
    margin-right:24px;
}
.box2 .selec_toggle span i{
    display: inline-block;
    width:11px;
    height:11px;
    border:1px solid #fff;
    box-sizing: border-box;
    border-radius:10px;
    position: relative;
}
.box2 .selec_toggle span i em{
    width:3px;
    height:3px;
    border-radius:50%;
    background-color: #fff;
    position: absolute;
    top:3px;
    left:3px;
    display: none;
}
.box2 .selec_toggle span i em.active{
    display: inline-block;
}
.box2 .selec_toggle span b{
    color:#fff;
    line-height: 20px;
    font-weight: normal;
    margin-left:5px;
}
.box2 .selec_toggle_box>div{
    display: none;
}
.box2 .selec_toggle_box>div.active{
    display: inline-block;
}
.verif_code_box{
    position: relative;
}
.verif_code_box .verif_code{
    width:100px;
    height:40px;
    line-height: 40px;
    border-top-right-radius:20px;
    border-bottom-right-radius:20px;
    background-color: rgba(255,255,255,.6);
    position: absolute;
    right:0;
    top:0;
}
.box2 .selec_toggle_box .verif_code_box .verif_code canvas {
    width:60px;
    height:30px;
    margin:5px;
    cursor: pointer;
    background-color: #fff;
}
/*TODO 第三个页面-忘记密码-发送验证码*/
.box3 .title .receive_code{
    width:85px;
    font-size:13px;
    margin-left:10px;
    color:#fff;
    display: inline-block;
}
.box3 .input_box{
    margin-top:40px;
}
.box3 .verif_code_box .verif_code{
    cursor: pointer;
}
.box3 .verif_code_box .verif_code i{
    color:#f89b38;
    font-size:14px;
    font-style: normal;
}
/*TODO 第四个页面-登录-学号登录*/
.box4 .input_box{
    margin-top:40px;
}

.modal .input_box .tip_info {
    width: auto;
    line-height: 20px;
    font-size: 12px;
    color: #fff;
    display: none;
    padding:5px 20px;
    margin-bottom:20px;
    border-radius:20px;
    background-color: #e0445a;
}
.modal .input_box .tip_info label {
    font-weight: normal;
    line-height: 20px;
    margin: 0;
}
.modal .input_box .tip_info label:after {
    content: "/";
    margin: 0 10px;
}
.modal .input_box .tip_info label:last-child:after {
    content: "";
    margin: 0;
}

/*TODO 注册页面*/
.modal .modal-container.container2 .modal-box {
    display: block;
}
.modal-box.box21 .title p{
    color:#f89b38;
}
.modal-box.box21 .title h4 .no_info{
    color:rgba(248,155,56,.6);
}
.modal-box.box21 .title .click_login{
    color:#f89b38;
    text-decoration: underline;
    cursor: pointer;
}
.box21 .input_box{
    margin-top:40px;
}
.box1.box21 .input_box input{
    color:#f89b38;
    border:1px solid rgba(248,155,56,.6);
    background-color: rgba(248,155,56,.1);
}
.box1.box21 .input_box input:focus{
    color:#f00;
}
.box21 .input_box .pwd_info span{
    color:rgba(248,155,56,.6);
}
/*TODO H5的input的placeholder样式*/
.box21 input::-webkit-input-placeholder,
.box21 input:-moz-placeholder,
.box21 input::-moz-placeholder,
.box21 input:-ms-input-placeholder{
    color: rgba(248,155,56,.6);
}

.box21 .input_box input.eff:focus{
    color:rgba(248,155,56,.1);
    background-color: rgba(248,155,56,0);
    border-color:#f89b38;
}
.box21 .input_box .login input{
    color:#fff;
    background: -webkit-linear-gradient(bottom,#f88038,#f66b0f);
    background: linear-gradient(bottom,#f88038,#f66b0f);
}
.box21 .input_box .login input:focus{
    color:#fff;
}
.box21 .input_box b{
    color:rgba(248,155,56,.6);
}
.box21 .input_box>div.sub_title span, .box21 .input_box>div.sub_title a {
    color:#f89b38;
    margin-right:0;
    cursor: default;
}
.box21 .input_box>div.sub_title span:last-child, .box21 .input_box>div.sub_title a:last-child {
    text-decoration: underline;
    cursor: pointer;
}
.box21 .verif_code_box .verif_code{
    background-color: rgba(248,155,56,.6);
    right:0;
    cursor: pointer;
}
.box21 .verif_code_box .verif_code a {
    color:#fff;
    font-size:14px;
    font-style: normal;
}
.box21 .verif_code_box .verif_code img {
    width:60px;
    height:30px;
    margin:5px;
    background-color: #fff;
    display: inline-block;
    vertical-align: baseline;
    cursor: pointer;
}

.reg_slideDown{
    display: none;
}

/*TODO 选择学校自动完成*/
.ui-menu{
    width:260px;
    border-bottom-left-radius:15px;
    border-bottom-right-radius:15px;
    background-color: rgba(255,255,255,.8);
    z-index:1000000 !important;
}
.ui-menu .ui-menu-item{
    width:260px;
    border-bottom:1px solid rgba(0,0,0,.1);
}
.ui-menu .ui-menu-item:last-child {
    border-bottom:0;
    border-bottom-left-radius:15px;
    border-bottom-right-radius:15px;
}
.ui-menu .ui-menu-item:hover{
    background-color: rgba(248,155,56,.6);
}
.ui-menu .ui-menu-item:last-child .ui-menu-item-wrapper{
    border-bottom:0;
}
.ui-menu .ui-menu-item-wrapper{
    line-height: 30px;
    padding: 0 20px;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    border-color: transparent;
    border-bottom:1px solid rgba(0,0,0,.1);
    background: rgba(248,155,56,.6);
    color: #ffffff;
}

.landing { display: none; font-size: 14px; line-height: 24px; color: #fff;}
.landing img { width: 24px;}