html{font:14px/1.25 "微软雅黑",Trajan Pro,Arial,sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{background:#ffffff;color:#363636;font-family: "微软雅黑"!important}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{padding:0;margin:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-weight:normal;font-style:normal;}
ol,ul{list-style:none;}
h1,h2,h3,h4,h5,h6{font-weight:normal;font-size:100%;}
q:before,q:after{content:"";}
.clearfix{*zoom:1;}
.clearfix:after{display:block;overflow:hidden;clear:both;height:0;visibility:hidden;content:".";}
img{display: inline-block; vertical-align: middle;}
input{outline-style: none;}

a{text-decoration:none;color:#363636;outline:none;}
a:hover{text-decoration: none!important;}
body[isLogout="true"] #commonMsg-box{ display: none; }
.cantainer { width: 1180px!important; margin: 0 auto;}
.ms-controller { display: none; }

.bb-line { border-bottom: 1px solid #e5e5e5; }

.textNull { text-align: center; vertical-align: middle; }
/* 字体大小 */
.f12{font-size: 12px;}
.f14{font-size: 14px;}
.f16{font-size: 16px;}
.f20{font-size: 20px;}
.f32{font-size: 32px;}
/* 字体粗细 */
.fN{font-weight: normal;}
.fB{font-weight: bold;}
/* 间距 */
.mt0{margin-top: 0;}
.mt5{margin-top: 5px;}
.mt7{margin-top: 7px;}
.mt10{margin-top: 10px;}
.ml10{margin-left: 10px;}
.mr10{margin-right: 10px;}
.mt20{margin-top: 20px;}
.ml20{margin-left: 20px;}
.mr20{margin-right: 20px;}
.mb20{margin-bottom: 20px;}
.mt30{margin-top: 30px;}
.ml30{margin-left: 30px;}
.mr30{margin-right: 30px;}
.mb30{margin-bottom: 30px;}
.mt40 { margin-top: 40px; }
.mt15 { margin-top: 15px; }
.mb40 { margin-bottom: 40px; }
/* 浮动 */
.fl{float: left;}
.fr{float: right;}
/* 省略号 */
.etc{white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.etc3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;}
.etc3-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;}

/*文字顔色*/

/* 重要文字 */
.cGray,
.cGray:visited,
.cGray a{color: #363636;}
/* 二级文字 */
.cDGray,
.cDGray:visited,
.cDGray a{color: #696969;}
/* 三级文字 */
.cEGray,
.cEGray:visited,
.cEGray a{color: #f6f6f6;}

.cRed { color: #e13231 }
.default { color: #f87620 }
.cGreen { color: #89d387 }

/*背景颜色*/
.first_level{background-color: #ffffff;}
.second_level{background-color: #f2f2f2;}
.third_level{background-color: #f6f6f6;}
.fourth_level{background-color: #211e23;}

.cOrage{background-color: #fe7c26;}
.cDorage{background-color: #e8b97c;}


.border-none{border: none !important;}
.posr{position: relative;}
.abso{position: absolute;}


.w1180{width: 1180px; margin: 0 auto;}

.w260{width:260px;float:left;}
.w900{width:900px;float:right;}

.w280{width:280px;float:left;}
.w380{width:380px;float:left;}

.w800{width:800px;float:left;}
.w350{width:350px;float:right;}

/* 按钮 */
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  width:100px;
  height: 20px;
  line-height: 20px;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;  
  cursor: pointer;  
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

.btn.focus, .btn:focus, .btn:hover {
    color: #333;
    text-decoration: none
}

.btn.active, .btn:active {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125)
}

.btn.disabled, .btn[disabled], fieldset[disabled] .btn {
    cursor: not-allowed;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: .65
}

a.btn.disabled, fieldset[disabled] a.btn {
    pointer-events: none
}

.button,.btnInfo { background-color: #f87620; color: #fff; padding: 0 20px; border-radius: 20px; height: 40px; line-height: 40px; text-align: center; cursor: pointer; }
.btnInfo { background: #acacac }
.btn-default {color: #333;background-color: #fff;border-color: #ccc;}
.btn-primary {color: #fff;background-color: #337ab7;border-color: #2e6da4;}
.btn-success {color: #fff;background-color: #5cb85c;border-color: #4cae4c;}
.btn-info    {color: #fff;background-color: #5bc0de;border-color: #46b8da;}
.btn-warning {color: #fff;background-color: #f0ad4e;border-color: #eea236;}
.btn-danger  {color: #fff;background-color: #d9534f;border-color: #d43f3a;}
/* 百分比部分 */
.row{width:100%;zoom:1;}
.row.mid-fix{ width:1200px;margin:0 auto;}
.mid-fix{width:1200px;margin:0 auto;}
.container{width:1180px;margin:0 auto;}
/*grid 1*/
.span1-1{width:100%;}
/*grid 2*/
.span1-2{width:50%;}
/*grid 3*/
.span1-3{width:33.333333333333336%;*width:33.233333333333336%;}
.span2-3{width:66.66666666666667%;*width:66.56666666666667%;}
/*grid 4*/
.span1-4{width:25%;}
.span2-4{width:50%;}
.span3-4{width:75%;}
/*grid 5*/
.span1-5{width:20%;}
.span2-5{width:40%;}
.span3-5{width:60%;}
.span4-5{width:80%;}
/*grid 6*/
.span1-6{width:16.666666666666668%;*width:16.566666666666668%;}
.span2-6{width:33.333333333333336%;*width:33.233333333333336%;}
.span3-6{width:50%;}
.span4-6{width:66.66666666666667%;*width:66.56666666666667%;}
.span5-6{width:83.33333333333334%;*width:83.23333333333334%;}
/*grid 7*/
.span1-7{width:14.285714285714286%;*width:14.185714285714286%;}
.span2-7{width:28.571428571428573%;*width:28.471428571428573%;}
.span3-7{width:42.85714285714286%;*width:42.75714285714286%;}
.span4-7{width:57.142857142857146%;*width:57.042857142857146%;}
.span5-7{width:71.42857142857143%;*width:71.32857142857143%;}
.span6-7{width:85.71428571428572%;*width:85.61428571428572%;}
/*grid 8*/
.span1-8{width:12.5%;*width:12.4%;}
.span2-8{width:25%;}
.span3-8{width:37.5%;*width:37.4%}
.span4-8{width:50%;}
.span5-8{width:62.5%;*width:62.4%;}
.span6-8{width:75%;}
.span7-8{width:87.5%;*width:87.4%;}
/*grid 9*/
.span1-9{width:11.11111111111111%;*width:11.01111111111111%;}
.span2-9{width:22.22222222222222%;*width:22.12222222222222%;}
.span3-9{width:33.33333333333333%;*width:33.23333333333333%;}
.span4-9{width:44.44444444444444%;*width:44.34444444444444%;}
.span5-9{width:55.55555555555556%;*width:55.45555555555556%;}
.span6-9{width:66.66666666666666%;*width:66.56666666666666%;}
.span7-9{width:77.77777777777777%;*width:77.67777777777777%;}
.span8-9{width:88.88888888888889%;*width:88.78888888888889%;}
/*grid 10*/
.span1-10{width:10%;}
.span2-10{width:20%;}
.span3-10{ width:30%;}
.span4-10{ width:40%;}
.span5-10{width:50%;}
.span6-10{width:60%;}
.span7-10{width:70%;}
.span8-10{ width:80%;}
.span9-10{width:90%;}
/*grid 11*/
.span1-11{ width:9.090909090909092%;*width:8.990909090909092%;}
.span2-11{ width:18.181818181818183%;*width:18.081818181818183%;}
.span3-11{ width:27.272727272727273%;*width:27.172727272727273%;}
.span4-11{ width:36.36363636363637%;*width:36.26363636363637%;}
.span5-11{width:45.45454545454546%;*width:45.35454545454546%;}
.span6-11{width:54.54545454545455%; *width:54.44545454545455%;}
.span7-11{width:63.63636363636364%; *width:63.53636363636364%;}
.span8-11{width:72.72727272727273%; *width:72.62727272727273%;}
.span9-11{ width:81.81818181818183%;*width:81.71818181818183%;}
.span10-11{width:90.90909090909092%;*width:90.80909090909092%;}
/*grid 12*/
.span1-12{width:8.333333333333334%;*width:8.233333333333334%;}
.span2-12{ width:16.666666666666668%;*width:16.566666666666668%;}
.span3-12{width:25%;}
.span4-12{width:33.333333333333336%;*width:33.233333333333336%;}
.span5-12{width:41.66666666666667%;*width:41.76666666666667%;}
.span6-12{width:50%;}
.span7-12{ width:58.333333333333336%;*width:58.233333333333336%;}
.span8-12{width:66.66666666666667%; *width:66.76666666666667%;}
.span9-12{ width:75%;}
.span10-12{width:83.33333333333334%;*width:83.23333333333334%;}
.span11-12{width:91.66666666666667%; *width:91.56666666666667%;}
.mar-left{padding:10px 10px 10px 0;}
.mar-right{padding:10px 0 10px 0;}
/* placeholder*/
::-webkit-input-placeholder{color:#8c8c8c;} 
::-moz-placeholder{color:#8c8c8c;}
:-moz-placeholder{color:#8c8c8c;}



/*动画效果*/
.animate-enter, .animate-leave{
    transition: all 1s;
    -moz-transition: all 1s; /* Firefox 4 */
    -webkit-transition: all 1s; /* Safari 和 Chrome */
    -o-transition: all 1s; /* Opera */
}  
.animate-enter-active, .animate-leave{
    bottom: 0px;
}
.animate-leave-active{
    bottom:120px;
}


.day.active { background: #f87620!important; color: #fff; }
textarea { resize : none;outline-style: none; } 



/*日历箭头*/
.fa { background: url(/src/img/icon.png) no-repeat -393px -7px; width: 10px; height: 17px; display: inline-block; background-size: 500px 500px }
.fa.fi-arrow-right {  background: url(/src/img/icon.png) no-repeat -367px -7px;  }


h2.title span { font-size: 12px; height: 20px; line-height: 20px; padding: 0 5px; border-radius: 5px; margin-left: 10px; display: inline-block; vertical-align: top;  font-weight: bold;}
h2.title span.Unclaimed { color: #81d07f; border: 1px solid #81d07f; }
h2.title span.Hasbeen { color: #acacac; border: 1px solid #acacac; }
h2.title span.Notreach { color: #f8b320; border: 1px solid #f8b320; }

i.icon { background: url(/src/img/icon.png) no-repeat; }

.notData { background: #f9f9f9; padding: 100px; text-align: center; font-size: 16px; }

.commonMsg { z-index: 9; background: #f87620; height: 50px; width: 50px; position: fixed; right: 20px; bottom: 50px }
.commonMsg.tada:hover {animation-name: tada;}
.commonMsg .icons i.icon {background: url(/src/img/icon.png) no-repeat -11px -255px; width: 30px; height: 30px; display: inline-block;}
.commonMsg .icons { padding: 10px; cursor: pointer; }
.commonMsg .msgNum { background: #ff1212; position: absolute; top: -10px; right: -10px; border-radius: 50%; color: #fff; text-align: center;width: 20px; height: 20px; box-shadow: 1px 1px 5px #fff; }
.commonMsg .msgBox { width: 550px; position: absolute; right: 90px; max-height: 300px; background: #fff; bottom: 0; border-radius: 5px; box-shadow: 0 0 15px rgba(0,0,0,.2) }
.commonMsg .msgBox .title { height: 48px; border-bottom: 1px solid #e5e5e5; }
.commonMsg .msgBox .title h2 { line-height: 48px; padding: 0 20px; }
.commonMsg .msgBox .title .switch {right: 20px; top: 15px; position: absolute;}
.commonMsg .msgBox .title .switch .def { float: left; background: #f2f2f2; width: 24px!important; height: 24px!important; margin-left: 10px; cursor: pointer; }
.commonMsg .msgBox .title .switch .def.active { background: #f87620; }
.commonMsg .msgBox .title .switch .def i.icon {background: url(/src/img/icon.png) no-repeat -11px -10px; width: 14px; height: 14px; display: inline-block; margin: 5px;}
.commonMsg .msgBox .title .switch .def i.icon.right {background: url(/src/img/icon.png) no-repeat -328px -48px; }
.commonMsg .msgBox .title .switch .def i.icon.left {background: url(/src/img/icon.png) no-repeat -309px -48px; }
.commonMsg .msgBox .title .switch .def.active i.icon.left {background: url(/src/img/icon.png) no-repeat -288px -48px; }
.commonMsg .msgBox .title .switch .def.active i.icon.right {background: url(/src/img/icon.png) no-repeat -11px -10px; }
.commonMsg .msgBox .tbody { padding: 0 20px; }
.commonMsg .msgBox .tbody ul li { height: 46px; line-height: 46px; }
.commonMsg .msgBox .tbody ul li .fl { width: 450px; }
.commonMsg .msgBox .tbody ul li .fr { width: 50px; text-align: right; color: #3694d2; cursor: pointer; }
.commonMsg .msgBox .tbody .triangle { position: absolute; right: -20px; bottom: 0px;width:0; 
    height:0; 
    border-top:30px solid transparent;
    border-bottom: 30px solid transparent;
    border-left: 30px solid #fff; }

.optEdit{padding: 0;
    margin:0;
    float:left;
    height: 40px;
    padding: 10px 0;/*当时解决输入框光标顶满input框的问题是这么解决的 如果设置了行高就会顶满没有行高的话光标高度=文字的font-size */
    border: none;
    outline: none;
    padding-left: 20px;
    color:#6d6d6d;
    -webkit-appearance:none; /*去除系统默认的样式*/
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);   /* 点击去除高亮的颜色*/
    background-color: #fff;
  }

.animated {
    animation-duration: 0.5s;
    animation-fill-mode: both;
}

.animated_1 {
    animation-duration: 1s;
    animation-fill-mode: both;
}
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.fadeInDown {
    animation-name: fadeInDown;
}

@keyframes zoomInDown {
    from {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    }
}

@keyframes bounce {
    from, 20%, 53%, 80%, to {
        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        transform: translate3d(0,0,0);
    }

    40%, 43% {
        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        transform: translate3d(0, -30px, 0);
    }

    70% {
        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        transform: translate3d(0, -15px, 0);
    }

    90% {
        transform: translate3d(0,-4px,0);
    }
}

.bounce {
    animation-name: bounce;
    transform-origin: center bottom;
}

@keyframes flipInX {
    from {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        animation-timing-function: ease-in;
        opacity: 0;
    }

    40% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        animation-timing-function: ease-in;
    }

    60% {
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1;
    }

    80% {
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }

    to {
        transform: perspective(400px);
    }
}

.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    animation-name: flipInX;
}

@keyframes flipOutX {
    from {
        transform: perspective(400px);
    }

    30% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1;
    }

    to {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0;
    }
}

.flipOutX {
    animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@keyframes tada {
    from {
        transform: scale3d(1, 1, 1);
    }

    10%, 20% {
        transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    }

    30%, 50%, 70%, 90% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }

    40%, 60%, 80% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }

    to {
        transform: scale3d(1, 1, 1);
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}