﻿/*Login*/
html,body{ height: 100%;}
input,select,textarea:focus{ outline:none;}
.loginbody{ background: #dcdddd url(../Images/loginbg_cn.png) no-repeat center top; font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;}
.logo{ width: 260px; position: absolute; top: 18%; left: 50%; margin-left: -106px;}
.content{ width:330px; position: absolute; left:50%; margin: 278px 0 0 -170px; text-align: right; overflow: hidden;}
.box{ display: inline-block; width:270px; text-align: left;}
.title{ font-size: 22px; color: #333333; margin: 17px 0 17px 21px; cursor: default; font-weight: 500;}
.textbox{ position: relative; margin-bottom: 6px; font-size: 13px;}
/* ç¡®ä¿æ‰€æœ‰è¾“å…¥æ¡†åº”ç”¨ç»¿è‰²è¾¹æ¡† */
.text{ 
    width: 100%; 
    height: 34px; 
    line-height: 34px; 
    border-radius: 17px; 
    background: #fff; 
    border: 1px solid #14a83b; 
    color: #555555; 
    text-indent: 94px; 
    padding: 0; 
    box-sizing: border-box;
}
/* ä¿®æ”¹spanæ ·å¼æ·»åŠ ç»¿è‰²è¾¹æ¡† */
.textbox span{ 
    position: absolute; 
    left: 0; 
    top: 0; 
    line-height: 32px; /* è°ƒæ•´ä¸º32pxï¼Œé€‚åº”è¾¹æ¡† */
    padding: 0 10px 0 15px; 
    border-radius: 17px 0 0 17px; 
    color: #555555; 
    cursor: default; 
    background: #fff; 
    font-weight: 500;
    border: 1px solid #14a83b; /* æ·»åŠ ç»¿è‰²è¾¹æ¡† */
    border-right: none; /* ç§»é™¤å³è¾¹æ¡† */
    height: 32px; /* ç¡®ä¿é«˜åº¦åŒ¹é… */
}
.send{ position: absolute; right: 0; top:0; height: 34px; border:0; border-radius:17px;background: linear-gradient(#14a83b, #14a83b); color: #fff; padding: 0 10px; cursor: pointer; font-weight: 500;}
.code{ position: absolute; top:7px; right: 15px; height: 22px;}
.lagpsd{ font-size: 13px; color:#444444; text-align: left; white-space: nowrap; margin-top: 15px; cursor: default;}
.lagpsd select{ border: 0; height: 20px; color:#444444; border-radius: 10px; padding-left:10px; margin-left: 4px; background: #f7f8f8;}

/* å®Œå…¨é‡æ–°å¸ƒå±€btnLoginå’Œå¿˜è®°å¯†ç  */
.lagpsd {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.lagpsd > div:first-child {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}
.lagpsd img{ 
    height: 42px; 
    vertical-align: middle; 
    transition: all .2s ease-in-out; 
    cursor: pointer;
    margin-right: 0; /* ç§»é™¤å³è¾¹è· */
}
.lagpsd img:hover{ opacity: .9;}
.lagpsd a{ 
    text-decoration: none; 
    color: #14a83b; 
    font-weight: 500; 
    margin-left: 0; /* é‡ç½®å·¦è¾¹è· */
}
.lagpsd a:hover{ text-decoration: underline;}
.z-fleJust{ 
    display: flex;
    align-items: center;
}

@media screen and (max-width:480px){ 
    .content{
        margin: 270px 0 0 -155px;
    }
    .box{
        margin-right: 30px;
    }
    .loginbody{
        
    }
    .title{
        margin: 17px;
        text-align: center;
    }
    /* ç§»åŠ¨ç«¯å¸ƒå±€è°ƒæ•´ */
    .lagpsd {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        position: relative;
        width: 100%;
    }
    .lagpsd > div:first-child {
        position: static;
        margin-right: 15px;
        margin-left: 50%;
    }
    .lagpsd > div.z-fleJust {
        display: flex;
        flex-direction: row;
    }
    .z-fleJust > div {
        display: block !important;
    }
    .z-fleJust > div:last-child {
        display: block !important;
    }
    .lagpsd a {
        font-size: 14px;
        color: #14a83b;
        display: block;
    }
}
