@charset "utf-8";
/* CSS Document */
html{ font-size: 20px; min-height: 100%; }
body { font-family: roboto,"微软雅黑"; font-size: 16px; margin: 0 auto; }

* { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent;  }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre,
form, fieldset, input, textarea, p, blockquote, th, td, img, span { padding: 0; margin: 0; }

fieldset, img { border: 0; }
address, caption, cite, code, dfn, em, th, var, i { font-weight: normal; font-style: normal; }
ol, ul, li { list-style: none; }
div, dl, dt, dd, ol, ul, li { zoom: 1; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100%; }
q:before, q:after { content: ''; }
abbr, acronym { border: 0; }
b, strong { font-weight: bold; }
a, img, button, input, textarea { -webkit-tap-highlight-color: rgba(255,255,255,0); }
table { border-collapse: collapse; }
input, textarea { outline: 0; resize: none; border: 0; }
button,
input,
optgroup,
textarea { -webkit-appearance: none; color: inherit; font: inherit; margin: 0; }
select { color: inherit; font: inherit; margin: 0; }
button { overflow: visible; }
button,
select { text-transform: none; }
input[type="text"] { border-radius: 0; }
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled],
html input[disabled] { cursor: default; }
button::-moz-focus-inner,
input::-moz-focus-inner { border: 0; padding: 0; }

input { line-height: normal; box-sizing: border-box; }
input[type="checkbox"],
input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
/*label { display: inline-block; max-width: 100%; font-weight: bold; }*/

a { text-decoration: none; color: #666666; }
a:hover { text-decoration: none; }
.fl { float: left; }
.fr { float: right; }
.clearfix:after { content: "."; display: block; height: 0; font-size: 0; clear: both; visibility: hidden; }
.clearfix { +height:1%; }
.hide { display: none; }
.pr { position: relative; }
.pa { position: absolute; }
.vertical { display: inline-block; vertical-align: middle; }
.center { text-align: center; }
.hidden { overflow: hidden; }

.ellipsis { overflow: hidden; text-overflow: ellipsis; display: block; white-space: nowrap; }

.ellipsis_2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.ellipsis_3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

.ellipsis_4 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }
.flex { position: relative; display: -webkit-box; display: -webkit-flex; display: flex; }

.flex_center { position: relative; display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; -webkit-box-align: center; -webkit-align-items: center; }

.flex_end { position: relative; display: -webkit-box; display: -webkit-flex; display: flex; align-items: flex-end; -webkit-box-align: flex-end; -webkit-align-items: flex-end; }

.flex_1 { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; }




/*背景色*/


/*文字大小*/
.f0 { font-size: 0; }
.f10 { font-size: 1.0rem; }
.f11 { font-size: 1.1rem; }
.f12 { font-size: 1.2rem; }
.f13 { font-size: 1.3rem; }
.f14 { font-size: 1.4rem; }
.f15 { font-size: 1.5rem; }
.f16 { font-size: 1.6rem; }
.f17 { font-size: 1.7rem; }
.f18 { font-size: 1.8rem; }
.f19 { font-size: 1.9rem; }
.f20 { font-size: 2.0rem; }
.f21 { font-size: 2.1rem; }
.f22 { font-size: 2.2rem; }
.f23 { font-size: 2.3rem; }
.f24 { font-size: 2.4rem; }

/*宽度*/


/*颜色*/

/*margin*/

/*padding*/


/****************  特殊字体  ****************/
/****************  特殊字体  ****************/
@font-face {
    font-family: 'Arial';
    src: url('../fonts/arial.eot') format('embedded-opentype'),
    url('../fonts/arial.svg') format('svg');
    /*url('../fonts/arial.ttf') format('truetype'),*/
    /*url('../fonts/arial.woff') format('woff'),*/
    /*url('../fonts/arial.woff2') format('woff2');*/
    font-weight: normal; font-style: normal;
}

@font-face{
    font-family: 'roboto';
    src: url('../../../en/pc/font/roboto/roboto.eot') format('embedded-opentype');
url('../../../en//font/roboto/roboto.woff2') format('woff2'),
url('../../../en/font/roboto/roboto.woff') format('woff'),
url('../../../en//font/roboto/roboto.ttf') format('truetype')
    /*url('https://leimg.jiagle.com/fonts/roboto.svg') format('svg');*/
}

/**********  公用样式 *********/
.white::-webkit-input-placeholder { color: #f0e0dc; }


/*动画*/
/*-webkit-animation: ani-arrow 1.5s infinite ease-in-out;
-moz-animation: ani-arrow 1.5s infinite ease-in-out;
animation: ani-arrow 1.5s infinite ease-in-out;*/

@-webkit-keyframes ani-arrow {
    0%,30% { opacity: 0; -webkit-transform: translate(0,10px); }

    60% { opacity: 1; -webkit-transform: translate(0,0); }

    100% { opacity: 0; -webkit-transform: translate(0,-8px); }
}

@-moz-keyframes ani-arrow {
    0%,30% { opacity: 0; -moz-transform: translate(0,10px); }

    60% { opacity: 1; -moz-transform: translate(0,0); }

    100% { opacity: 0; -moz-transform: translate(0,-8px); }
}

@keyframes ani-arrow {
    0%,30% { opacity: 0; transform: translate(0,10px); }

    60% { opacity: 1; transform: translate(0,0); }

    100% { opacity: 0; transform: translate(0,-8px); }
}

@-moz-keyframes ani-arrow {
    0% { -moz-transform: translate(0,0); opacity: 0; }

    30% { -moz-transform: translate(-20px,-20px); opacity: 1; }

    100% { -moz-transform: translate(-30px,-30px); opacity: 0; }
}



@-webkit-keyframes rocketArray {
    0%,30% { opacity: 0; -webkit-transform: translate(0,-8px); }

    60% { opacity: 1; -webkit-transform: translate(0,0); }

    100% { opacity: 0; -webkit-transform: translate(0,10px); }
}

@-moz-keyframes rocketArray {
    0%,30% { opacity: 0; -moz-transform: translate(0,-8px); }

    60% { opacity: 1; -moz-transform: translate(0,0); }

    100% { opacity: 0; -moz-transform: translate(0,10px); }
}

@keyframes rocketArray {
    0%,30% { opacity: 0; transform: translate(0,-8px); }

    60% { opacity: 1; transform: translate(0,0); }

    100% { opacity: 0; transform: translate(0,10px); }
}

@-moz-keyframes rocketArray {
    0% { -moz-transform: translate(-30px,-30px); opacity: 0; }

    30% { -moz-transform: translate(-20px,-20px); opacity: 1; }

    100% { -moz-transform: translate(0,0); opacity: 0; }
}



@keyframes rotate2 {
    from { transform: rotate(0deg); -ms-transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); }
    to { transform: rotate(360deg); -ms-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); }
}

@-webkit-keyframes rotate2 {
    from { transform: rotate(0deg); -ms-transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); }
    to { transform: rotate(360deg); -ms-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); }
}

@-webkit-keyframes wobble2 {
    0% { -webkit-transform: rotate3d(0,0,1,-15deg); transform: rotate3d(0,0,1,-15deg); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; }
    100% { -webkit-transform: rotate3d(0,0,1,10deg); transform: rotate3d(0,0,1,15deg); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; }
}

@keyframes wobble2 {
    0% { -webkit-transform: rotate3d(0,0,1,-30deg); transform: rotate3d(0,0,1,-15deg); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; }
    100% { -webkit-transform: rotate3d(0,0,1,15deg); transform: rotate3d(0,0,1,15deg); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; }
}


@-webkit-keyframes up_down2 {
    0% { transform: translateY(-10%); -webkit-transform: translateY(-10%); }
    100% { transform: translateY(10%); -webkit-transform: translateY(10%); }
}

@keyframes up_down2 {
    0% { transform: translateY(-10%); -webkit-transform: translateY(-10%); }
    100% { transform: translateY(10%); -webkit-transform: translateY(10%); }
}

@-webkit-keyframes scaleDraw {
    0% { transform: scale(0.5); -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -o-transform: scale(0.5); }
    100% { transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); }
}

@keyframes scaleDraw {
    0% { transform: scale(0.5); -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -o-transform: scale(0.5); }
    100% { transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); }
}


@-webkit-keyframes leftRight {
    0% { transform: translateX(-10%); -webkit-transform: translateX(-10%); }
    100% { transform: translateX(10%); -webkit-transform: translateX(10%); }
}

@keyframes leftRight {
    0% { transform: translateX(-10%); -webkit-transform: translateX(-10%); }
    100% { transform: translateX(10%); -webkit-transform: translateX(10%); }
}



.d-inner,.d-border, .d-dialog{
    border-radius: 0 !important;
    background: #fff;
}
.d-content{
    padding: 0 !important;
}
.d-mask {
    opacity: 0.3 !important;
}
.d-dialog .d-close{
    font-size: 20px;
    font-weight: inherit;
}
.d-state-focus{
    box-shadow: none !important;
}


.userError {
    width: 50%;
    max-width: 1000px;
    margin: 20px auto 0;
    background: #fddfde;
    color: #444;
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.3);
    border: 1px solid #FBC9C8;
    padding: 15px;
    border-radius: 6px;
    font-weight: bold;
    margin-bottom: 20px;
    position: relative;
}
.userSuccess{
    background: #00800024;
    border: 1px solid #00800024;
}
.messageRemove{
    position: absolute;
    width: 20px;
    height: 20px;
    line-height: 1.2;
    text-align: center;
    font-size: 18px;
    top: 5px;
    right: 5px;
    cursor: default;
}