@charset "utf-8";
html {width: 100%; height: 100%; -ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%; }
body{ background:#fff; width:100%; height:100%; line-height: 24px; -webkit-touch-callout:none;
    font: 14px Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif; color: #333;}
*, *:before, *:after { box-sizing: border-box;}
*{margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,em,i{font-size:100%; font-weight:normal;}
ul,ol,li{list-style:none outside none;}
a{text-decoration:none;color:inherit;}
a:hover{ text-decoration: none;}
img{border:none;vertical-align:middle;max-width:100%;}
a,button,input{-webkit-tap-highlight-color:rgba(255,0,0,0);}
input{ border:none; outline:none; -webkit-appearance:none;}
input[type='text'],input[type='password'],input[type='button'],input[type='submit'],input[type='reset'], select{appearance:none; -webkit-appearance:none}
::-webkit-input-placeholder{color:#bbb;}
::-webkit-input-placeholder{color:#bbb;}
::-moz-placeholder{color:#bbb;}
:-ms-input-placeholder{color:#bbb;}
input::-webkit-input-placeholder{color:#bbb;}
input:focus::-webkit-input-placeholder{color:#bbb;}
input::-webkit-input-speech-button {display: none}
[class^="icon--"],[class*=" icon--"] {
    font-family: iconfont !important;  font-size: 16px;  font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale }
.cl:after,.clearfix:after,.form-item:after{content:"."; display:block; height:0; clear:both; visibility:hidden;}
.cl,.clearfix{zoom:1}
@media screen and (max-width: 750px){
    body{ font-size: 10px; line-height: 20px;}
}
.wrap{ width:100%; min-width: 1200px; -webkit-overflow-scrolling:touch;}
.area{ max-width:1200px; margin:0 auto;
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
/* @media screen and (max-width: 750px){
    .wrap{ min-width: 100%;}
    .area{ width:100%; min-width: 300px;}
} */
h1 {font-size:36px; font-weight: 400}
h2 {font-size:30px; font-weight: 400}
h3 {font-size:24px; font-weight: 400}
h4 {font-size:18px; font-weight: 400}
h5 {font-size:14px; font-weight: 400}
h6 {font-size:12px; font-weight: 400}

.c-fff{ color:#fff;}
.c-ccc{ color:#ccc;}
.c-333{ color:#333;}
.c-666{ color:#666;}
.c-999{ color:#999;}
.c-red{ color:#c00;}
.c-white{ color:#fff;}
.c-black{ color:#000;}
.c-grey{ color:#999;}
.c-primary{ color:#5a8bff;}
.c-success{ color:#07C160;}
.c-warning{ color:#ffc107;}
.c-orange{ color:#ff6700;}
.c-danger{ color:#dc3545;}

.radius{ border-radius:4px; }
.radius-l{border-radius:4px 0 0 4px;}
.radius-r{border-radius:0 4px 4px 0;}
.radius-rounded{ border-radius:50px;}

.text-l { text-align: left;}
.text-r { text-align: right;}
.text-c { text-align: center;}
.text-indent{ text-indent:2em;}
.ellipsis{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.fl{ float:left; _display:inline}
.fr{ float:right; _display:inline}
.inline-block{ display: inline-block}
.bg-white {  background-color: white; }
.cursor{ cursor: pointer;}
.hide{ display:none}
.scroll{ overflow: auto;}
.line{ font-size:0; line-height:0; border-top:1px solid #ddd; float:none;}
.w100{ width: 100%;}
.w50{ width: 50%;}
.text-indent{ text-indent: 20px;}
.dash { border-bottom: 1px dashed #ccc;  margin: 15px 0; }
hr{ width: 100%; height:1px; background: #ddd; overflow: hidden;}