@charset "utf-8";
/*!
 * Sand UI v1.0
 * Copyright 2016-04-28 chengq
 */
html,body,div,span,applet,object,iframe,frameset,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,legend,form,label,input,select,button,textarea,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{ margin: 0; padding: 0; word-break:break-all; word-wrap:break-word; vertical-align: baseline;}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary { display: block}

html, body{ -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; font-size: 10px;}
body{ font-family:"microsoft yahei",Arial, Helvetica, sans-serif; font-size: 1.4rem; line-height: 1.6; color:#333;}

/*开启app效果----start*/
body.pages, html{height: 100%;
}
.pages > .page{ -webkit-overflow-scrolling: touch; z-index: 1; min-height: 100%; position: relative; overflow: hidden;}

.sandapp .pages, .sandapp .pages > .page { width: 100%; background-color: #fff; height: 100%; -webkit-tap-highlight-color: transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
.sandapp .pages > .page{ opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow-y: auto;}
.sandapp .pages > .page:not(:first-child){ z-index: 10;}
.sandapp .pages > .page.js_show{ opacity: 1;}
.sandapp .pages > .page.js_hidden{ overflow: hidden;}
/*开启app效果----end*/

/*page_content*/
/*不在sandapp情况下添加overlay, 阻止body滚动，头尾固定,可设置内部区块滚动:=只针对有tab_menu,tab_box*/
.page.overlay{ height: 100%;}
.page.overlay .page_content, .page.overlay .page_content .content_block{ height: 100%;}
.page.overlay .page_content{ padding-top: 88px;}
.page_content{ padding-top: 44px; position: relative; }
.page_content > .content_title{ margin-top: 25px; margin-bottom: 15px;}
.page_content > .content_block{ margin-top: 15px; margin-bottom: 25px;}
.page_content > .content_block:last-child{ margin-bottom: 0;}

*, *:before, *:after{ box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  -webkit-tap-highlight-color:transparent; /* 1.去除android a/button/input标签被点击时产生的边框 2.去除ios a标签被点击时产生的半透明灰色背景 */}

/*a*/
a[title="站长统计"]{ display: none;}
a, a:active, a:hover{ text-decoration:none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}

/*ul li*/
ul, ol{ list-style-position: inside;}

/* img */
img{ vertical-align:top}
.img{ background-color: #ebebeb;}
.img_auto{ max-width:100%; height:auto;}

/*h*/
h1,h2,h3,h4,h5,h6{ font-style: normal; font-family: inherit; font-weight: 500; line-height: 1.6; color: inherit}
h1,.h1 { font-size: 36px } h2,.h2 { font-size: 30px} h3,.h3 { font-size: 24px } h4,.h4 { font-size: 18px } h5,.h5 { font-size: 14px } h6,.h6 { font-size: 12px }

/* .icon */
.iconfont{ font-size: 24px; line-height: 1.1; color: #999;}
.iconfont.small{ font-size: 16px;}
.iconfont.large{ font-size: 38px;}
.iconfont.active{ color: #ff0000;}
.iconfont.circle{ background-color: #00bc35; border-radius: 50%; -webkit-border-radius: 50%; display: inline-block; overflow: hidden; width: 18px; height: 18px; padding: 1px; color: #fff;}

/*loading*/
.loading_icon, .loading_img{ display: inline-block; width: 20px; height: 20px;}
.loading_icon{ border-radius: 50%; -webkit-border-radius: 50%;   border: 2px solid  rgba(0, 0, 0, 0.2); border-left-color: rgba(0, 0, 0, 0.3);}
.loading_img{ vertical-align: middle; background: transparent url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iciIgd2lkdGg9JzEyMHB4JyBoZWlnaHQ9JzEyMHB4JyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICAgIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJub25lIiBjbGFzcz0iYmsiPjwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjRTlFOUU5JwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoMCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSc0Ni41JyB5PSc0MCcgd2lkdGg9JzcnIGhlaWdodD0nMjAnIHJ4PSc1JyByeT0nNScgZmlsbD0nIzk4OTY5NycKICAgICAgICAgIHRyYW5zZm9ybT0ncm90YXRlKDMwIDUwIDUwKSB0cmFuc2xhdGUoMCAtMzApJz4KICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0naW5kZWZpbml0ZScvPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyM5Qjk5OUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSg2MCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9J2luZGVmaW5pdGUnLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjQTNBMUEyJwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoOTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNBQkE5QUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxMjAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCMkIyQjInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxNTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCQUI4QjknCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxODAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDMkMwQzEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyMTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDQkNCQ0InCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEMkQyRDInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEQURBREEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNFMkUyRTInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0Pgo8L3N2Zz4=) no-repeat; -webkit-background-size: 100%; background-size: 100%;}

.loading{ text-align: center; position: fixed; width: 100%; height: 100%; left: 0; top: 0; right: 0; bottom: 0; background-color: #4cae4c; z-index: 1051;}
.loading_c{ width: 100%; height: 20px; line-height: 20px; position: absolute; top: 50%; margin-top: -10px; font-size: 15px; color: #fff;}
.loading_c p{ display: inline-block;}

/* circle */
.img_circle, .img_rounded, .circle{ display: inline-block; overflow: hidden;}
.img_circle img, .img_rounded img{ max-width:100%;}
.img_circle, .circle{ border-radius: 50%; -webkit-border-radius: 50%; background-color: #ebebeb;}
.img_rounded{ border-radius: 6px; -webkit-border-radius: 6px;}

/* vertical */
.text_t{ vertical-align:top;} .text_m{ vertical-align:middle;} .text_b{ vertical-align:bottom;}
.text_l{ text-align:left;} .text_c{ text-align:center;} .text_r{ text-align:right;}
.text_j{ text-align: justify; text-align-last: justify; vertical-align: middle;}

/*text_color*/
.text_default{ color: #717171;}
.text_primary{ color:#337ab7;}
.text_success{ color: #5cb85c;}
.text_info{ color:#5bc0de;}
.text_warning{ color: #f0ad4e;}
.text_danger{ color:#d9534f;}

.nowrap{word-break:keep-all; white-space: nowrap; text-overflow:ellipsis; overflow:hidden;}

/*标识*/
.badge{ font-style: normal; display: inline-block; min-width: 16px; height: 16px; padding: 0 2px; background-color: #f94a6a; font-size: 12px; text-align: center; line-height: 16px; color: #fff; border-radius: 16px; -webkit-border-radius: 16px; position: relative; top: -1px; }

/* alpha */
/*.alphaWrap{ display:block; width:100%; height:auto; background:#000; border:0; filter:alpha(opacity=60); opacity:.6;}*/

/* margin */
.m_5{ margin:5px;} .m_t_5{ margin-top:5px;} .m_r_5{ margin-right:5px;} .m_b_5{ margin-bottom:5px;} .m_l_5{ margin-left:5px;}
.m_8{ margin:8px;} .m_t_8{ margin-top:8px;} .m_r_8{ margin-right:8px;} .m_b_8{ margin-bottom:8px;} .m_l_8{ margin-left:8px;}
.m_10{ margin:10px;} .m_t_10{ margin-top:10px;} .m_r_10{ margin-right:10px;} .m_b_10{ margin-bottom:10px;} .m_l_10{ margin-left:10px;}
.m_15{ margin:15px;} .m_t_15{ margin-top:15px;} .m_r_15{ margin-right:15px;} .m_b_15{ margin-bottom:15px;} .m_l_15{ margin-left:15px;}
.m_20{ margin:20px;} .m_t_20{ margin-top:20px;} .m_r_20{ margin-right:20px;} .m_b_20{ margin-bottom:20px;} .m_l_20{ margin-left:20px;}

/* padding */
.p_5{ padding:5px;} .p_t_5{ padding-top:5px;} .p_r_5{ padding-right:5px;} .p_b_5{ padding-bottom:5px;} .p_l_5{ padding-left:5px;}
.p_8{ padding:8px;} .p_t_8{ padding-top:8px;} .p_r_8{ padding-right:8px;} .p_b_8{ padding-bottom:8px;} .p_l_8{ padding-left:10px;}
.p_10{ padding:10px;} .p_t_10{ padding-top:10px;} .p_r_10{ padding-right:10px;} .p_b_10{ padding-bottom:10px;} .p_l_10{ padding-left:10px;}
.p_15{ padding:15px;} .p_t_15{ padding-top:15px;} .p_r_15{ padding-right:15px;} .p_b_15{ padding-bottom:15px;} .p_l_15{ padding-left:15px;}
.p_20{ padding:20px;} .p_t_20{ padding-top:20px;} .p_r_20{ padding-right:20px;} .p_b_20{ padding-bottom:20px;} .p_l_20{ padding-left:20px;}

/* float */
.fl, .fr { display: inline; float: left;}
.fr { float: right;}

/*********闭合盒子处理**********/
.clearfix:after, .container:after, .row:after, .navbar_hd:after, .navbar:after{ content:""; display:block; visibility:hidden; height:0; clear:both;}
.clearfix, .container, .row{zoom:1;}
/* Hides from IE-mac \*
* html .clearfix {height:1%;}.clearfix {display:block;}
/* End hide from IE-mac */

/*********清除浮动处理**********/
.clearboth { clear:both; display:block; height:0;font-size:0; overflow:hidden;}

/*icon_arrow*/
.icon_arrow_solid_t, .icon_arrow_solid_r, .icon_arrow_solid_b, .icon_arrow_solid_l{ display:inline-block; width:0; height:0; border:14px solid transparent; background-color: transparent; background: none;}
.icon_arrow_solid_t{ border-top-color:#000;}
.icon_arrow_solid_b{ border-bottom-color:#000;}
.icon_arrow_solid_r{ border-right-color:#000;}
.icon_arrow_solid_l{ border-left-color:#000;}

.icon_arrow_line_t, .icon_arrow_line_r, .icon_arrow_line_b, .icon_arrow_line_l{ width: 19px; height: 19px; display:inline-block; border-left: 2px solid #000; border-bottom:2px solid #000; background: none;}
.icon_arrow_line_t{ transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.icon_arrow_line_r{ transform: rotate(225deg); -webkit-transform: rotate(225deg);}
.icon_arrow_line_b{ transform: rotate(315deg); -webkit-transform: rotate(315deg);}
.icon_arrow_line_l{ transform: rotate(45deg); -webkit-transform: rotate(45deg);}

/* table-cell */
.tab{ display:table; width:100%; position:relative;}
.tab.equal{ table-layout:fixed;/*列宽一致性-等均*/}
.tab_cell{ display:table-cell; position:relative; width: 1%; list-style: none;}
.tab.auto .tab_cell{ width: auto;}

/*flexbox弹性比例分配空间，不可跨行*/
.flex{ position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;  box-align: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-align-items: center; -webkit-justify-content:center; justify-content:center; }
.flex .flex_cell{ -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; overflow: hidden; position: relative;}

/*.flex纵轴方向-适用父类*/
.flex_align_t{ box-align:start; -webkit-box-align: start;  -ms-flex-align: start; align-items: flex-start; -webkit-align-items: flex-start;}
.flex_align_c{ box-align: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-align-items: center; }
.flex_align_b{ box-align:end; -webkit-box-align: end;  -ms-flex-align: end; align-items: flex-end; -webkit-align-items: flex-end;}

/*.flex横轴方向-适用父类,而且里面内嵌也是flex而不是flex_cell*/
.flex_justify_l{ -webkit-justify-content: flex-start; justify-content:flex-start;}
.flex_justify_c{ -webkit-justify-content:center; justify-content:center;}
.flex_justify_r{ -webkit-justify-content:flex-end; justify-content:flex-end;}
.flex_justify_between{ -webkit-box-pack: justify; -ms-flex-pack: justify;  -webkit-justify-content: space-between; justify-content: space-between;}

/*flex-wrap弹性盒堆叠伸缩行-适用父类*/
.flex_wrap{/*跨行*/ -webkit-flex-wrap:wrap; flex-wrap:wrap; flex-direction: row; -webkit-align-content:flex-start; align-content:flex-start;}
.flex_wrap.nowrap{ /*不跨行*/-webkit-flex-wrap:nowrap; flex-wrap:nowrap;}
.flex_wrap.reverse{ /*反向*/-webkit-flex-wrap:wrap-reverse; flex-wrap:wrap-reverse;}
.flex_wrap .flex_cell{ flex: auto; -webkit-flex: auto; width: 50%;}

/*no_select*/
.no_select, .button, .button *{/*禁止选择复制*/  -moz-user-select:none;  /* Firefox私有属性 */  -webkit-user-select:none;  /* WebKit内核私有属性 */ -ms-user-select:none;  /* IE私有属性(IE10及以后) */ -khtml-user-select:none;  /* KHTML内核私有属性 */ -o-user-select:none;  /* Opera私有属性 */ user-select:none;  /* CSS3属性 */}

/*:focus*/
a, button, input, textarea, select, label{ font-size: 14px; font-weight: 400; font-family: inherit; }
input, textarea, select{ background-color: #fff; }
a, button, input, textarea, select, label, a:focus, button:focus, input:focus, textarea:focus{ outline:none; resize: none; -webkit-tap-highlight-color:transparent;/* 1.去除android a/button/input标签被点击时产生的边框 2.去除ios a标签被点击时产生的半透明灰色背景 */}
textarea, input[type="text"], input[type="password"], input[type="email"], input[type^="date"], input[type="time"], input[type="month"], input[type="week"], input[type="number"], input[type="tel"], input[type="button"], input[type="submit"], input[type="reset"], button, select {-webkit-appearance: none; /*去除ios内阴影*/}

/*input-占位符*/
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder, input::-moz-placeholder, textarea::-moz-placeholder, input::-ms-input-placeholder, textarea::-ms-input-placeholder { color:#b4cddc;}

/*form */
input[type="text"], input[type="password"], input[type="file"], input[type^="date"], input[type="time"], input[type="month"], input[type="week"], input[type="number"], input[type="tel"], [class^="button button_"]{ overflow: visible; vertical-align: middle; min-height: 36px;}

button, .button, .form_block{ border-radius: 4px; -webkit-border-radius: 4px;  border: 1px solid #ccc; color: #555; padding: 8px 12px; line-height: 1.3; vertical-align: top;}
button.button{ padding: 7px 12px 9px 12px;}

.form_block{ display: block; width: 100%; -webkit-transition: border-color ease-in-out .35s, -webkit-box-shadow ease-in-out .35s; transition: border-color ease-in-out .35s, box-shadow ease-in-out .35s;}
.form_block:focus { border-color: #66afe9; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); }

select.form_block{ height: 38px;}
textarea.form_block{ min-height: 80px;}
.button, .list_item{ list-style: none;}
.list_item{ line-height: 1.5;}

/*checkbox-开关*/
.form_switch{ -webkit-appearance: none; appearance: none; position: relative; width: 52px; height: 32px; border: 1px solid #DFDFDF; outline: 0; border-radius: 16px; box-sizing: border-box; background-color: #DFDFDF; -webkit-transition: background-color 0.1s, border 0.1s; transition: background-color 0.1s, border 0.1s; }
.form_switch:before { content: " "; position: absolute; top: 0; left: 0; width: 50px; height: 30px; border-radius: 15px; background-color: #FDFDFD; -webkit-transition: -webkit-transform 0.35s cubic-bezier(0.45, 1, 0.4, 1); transition: transform 0.35s cubic-bezier(0.45, 1, 0.4, 1); }
.form_switch:after { content: " "; position: absolute; top: 0; left: 0; width: 30px; height: 30px; border-radius: 15px; background-color: #FFFFFF; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); -webkit-transition: -webkit-transform 0.35s cubic-bezier(0.4, 0.4, 0.25, 1.35);  transition: transform 0.35s cubic-bezier(0.4, 0.4, 0.25, 1.35); }
.form_switch:checked { border-color: #04BE02; background-color: #04BE02; }
.form_switch:checked:before { -webkit-transform: scale(0); transform: scale(0);}
.form_switch:checked:after { -webkit-transform: translateX(20px); transform: translateX(20px);}

/*radio-单选框 | 复选框*/
label.label_checkbox input[type="checkbox"], label.label_checkbox input[type="radio"] { display: none;}
label.label_checkbox .icon_checkbox >.iconfont{ position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; display: none;}
label.label_checkbox .icon_checkbox { display: inline-block; vertical-align: middle; position: relative; width: 22px; height: 22px; -webkit-border-radius: 22px; border-radius: 22px; border: 1px solid #c7c7cc; box-sizing: border-box; }
label.label_checkbox input[type="checkbox"] + .item_media .icon_checkbox{ -webkit-border-radius: 0; border-radius: 0;}

label.label_checkbox input[type="checkbox"]:checked + .item_media .icon_checkbox, label.label_checkbox input[type="radio"]:checked + .item_media .icon_checkbox { border: none; background-color: #007aff; }
label.label_checkbox input[type="checkbox"]:checked + .item_media .icon_checkbox >.iconfont, label.label_checkbox input[type="radio"]:checked + .item_media .icon_checkbox >.iconfont{ display: block; color: #fff;}

/*select-下拉框-带箭头*/
.select_arrow_r:after, .form_select:after, .arrow_r:after { content: " "; display: inline-block; height: 6px; width: 6px; border-width: 2px 2px 0 0; border-color: #C8C8CD; border-style: solid; -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); position: absolute; top: 50%; right: 15px; margin-top: -3px;}

/*线条*/
.line_t:after, .line_r:after, .line_b:after, .line_l:after{ content: " "; position: absolute; width: 100%; height: 1px; background-color: #d9d9d9; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; }
.line_t:after, .line_b:after{-webkit-transform: scaleY(0.5); -ms-transform: scaleY(0.5); transform: scaleY(0.5);}
.line_l:after, .line_r:after{-webkit-transform: scaleX(0.5); -ms-transform: scaleX(0.5); transform: scaleX(0.5);}
.line_t:after{ top: 0; left: 0;}
.line_r:after{ top: 0; right: 0; width: 1px; height: 100%;}
.line_b:after{ left: 0; bottom: 0;}
.line_l:after{ top: 0; left: 0; width: 1px; height: 100%;}

/*图片上传*/
.form_upload { position: relative; width: 78px; height: 78px; border: 1px solid #D9D9D9; }
.form_upload:before, .form_upload:after { content: " "; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: #D9D9D9; width: 2px; height: 40px; }
.form_upload:after { width: 40px; height: 2px; }
.form_upload > input[type=file], .form_upload > input[type=button] { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

/*禁用*/
input[disabled], button[disabled], .button.disabled, .input.disabled, .button.disabled:active, .button.disabled:hover{ cursor: not-allowed !important; background-color:#eee !important;  border-color:#ccc !important; color:#bbb !important;}

/*关闭按钮*/
button.close { font-family: inherit; -webkit-appearance: none; padding: 0; cursor: pointer; font-size: 24px; font-weight: bold; width: 28px; height: 28px; line-height: 26px; position:absolute; top: -15px; right: -15px; border-radius: 50%; -webkit-border-radius: 50%;  background-color: #ededed; border: 1px solid #ededed; color: #616161;}

/*button*/
.button_row{ position: relative;}
.button_row .button{ white-space: nowrap; text-overflow: ellipsis; max-width: 100%;}
.button_row .badge{ position: absolute; left: -5px; top:  -5px;}
/*finish*/
.button.no, .button.no:active{ background-color: #e5e5e5 !important; color: #666 !important; border-color: #e0e0e0 !important;}
.button{ display:inline-block; white-space: nowrap; position: relative; text-align: center;  -webkit-user-select: none; user-select: none;/*禁止用户复制*/ touch-action: manipulation;/*鼠标悬停时不激活单击*/ cursor: pointer;/*-webkit-transition: all .5s cubic-bezier(0, 0, .2, 1); transition: all .5s cubic-bezier(0, 0, .2, 1);*/}
.button_s{ padding: 0 3px; height: 28px; line-height: 26px; min-height: 28px;}

.button_floating { color: #fff; position: fixed; right: 16px; bottom: 66px; width: 56px; height: 56px; border-radius: 50%; z-index: 2; overflow: hidden; -webkit-transition-duration: 300ms; transition-duration: 300ms; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; background-color: #333; }

.button_default{ background-color: #eee; border-color: #ccc; color: #333;}
.button_primary{ background-color: #1aa4fc; border-color: #1484c9; color: #fff;}
.button_success{ background-color: #5cb85c; border-color: #428542; color: #fff;}
.button_info{ background-color: #5bc0de; border-color: #4693ab; color: #fff;}
.button_warning{ background-color: #f0ad4e; border-color: #bd873c; color: #fff;}
.button_danger{ background-color: #d9534f; border-color: #a63f3c; color: #fff;}
.button_primary .iconfont, .button_success .iconfont, .button_info .iconfont, .button_warning .iconfont, .button_danger .iconfont, .button_floating .iconfont{ color: #fff;}

@media (min-width: 768px) {
    .button_default:hover{ background-color: #e5e5e5; border-color: #ccc;}
    .button_primary:hover{ background-color: #1795e3; border-color: #1484c9;}
    .button_success:hover{ background-color: #4f9e4f; border-color: #428542;}
    .button_info:hover{ background-color: #51a9c4; border-color: #4693ab;}
    .button_warning:hover{ background-color: #d69a45; border-color: #bd873c;}
    .button_danger:hover{ background-color: #bf4945; border-color: #a63f3c;}
}

.button_default:active{ background-color: #ccc;}
.button_primary:active{ background-color: #1484c9;}
.button_success:active{ background-color: #428542;}
.button_info:active{ background-color: #4693ab;}
.button_warning:active{ background-color: #bd873c;}
.button_danger:active{ background-color: #a63f3c;}

/*tab_buttons, tab_link, tab_box*/
.tab_buttons{ height: 44px; position: absolute; left: 0; top: 44px; width: 100%; z-index: 10; background-color: #fff;}
.tab_link{ padding: 0; color: #4d4d4d; text-align: center; font-size: 16px;}
.tab_link.active{ color: #fa5a5a;}
.tab_line{ position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background-color: #fa5a5a; -webkit-transform: scaleY(0.5); transform: scaleY(0.5); z-index: 1;}
.page.overlay .tab_box{ width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch;}
.tab_buttons .tab_link{ line-height: 44px;}

/*list*/
.list_block .list_link, .list_block a:not([class^=button]){ color: #1a1a1a;}
.list_block .tag{ opacity: 0.5;}
.list_link{ display: block;}
.item_inner{ height: 100%;}
.item_title{ font-size: 16px; white-space: nowrap; position: relative; overflow: hidden; text-overflow: ellipsis; max-width: 100%;}
.item_desc { width: 100%; font-size: 14px; color: #8e8e93; line-height: 21px; position: relative; overflow: hidden; height: 42px; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}
.item_delete{ position: absolute; top: 0; right: -70px; bottom: 0; background: #ff6060; color: #fff; font-size: 15px; width: 70px; text-align: center;}

/*card-卡片*/
.card_header, .card_content, .card_footer{ position: relative;}
.card_header h4{ color: #666; border-left: 3px solid #ffccd5; padding-left: 10px;}

/*高斯模糊*/
.blur{ -webkit-backface-visibility: hidden; -webkit-filter: blur(10px); /* Chrome, Opera */ -moz-filter: blur(10px); -o-filter: blur(10px); -ms-filter: blur(10px); filter: blur(10px); filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=10, MakeShadow=false); /* IE6~IE9 */
}
/*图层背景内容模糊*/
.backdrop{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.5); }
@supports (-webkit-backdrop-filter: none) {
    .backdrop{ filter: alpha(opacity=100); opacity: 1;  -webkit-backdrop-filter: brightness(1) blur(3px); -webkit-backface-visibility: hidden; }
}

/*no*/
.no_style{ list-style: none;}
.no_bg{ background-color: transparent !important;}
.no_border{ border: none !important; line-height: inherit;}
.no_p{ padding: 0 !important;}
.no_m{ margin: 0 !important;}
.no_shadow,.no_shadow.button:focus,.no_shadow.button:active,.no_shadow.button.active,.no_shadow:focus { box-shadow: none !important; -webkit-box-shadow: none !important; }

/*block*/
.block{ display: block; width: 100%;}

/*scroll*/
.overflow_scrolling{ -webkit-overflow-scrolling: touch; overflow-scrolling: touch;/*允许独立的滚动区域和触摸回弹*/}

/*public---------end*/
/*---模块--------------------------------*/
/*navbar-顶部导航*/
.navbar{ background-color: #fff; width: 100%; height: 44px; z-index: 20; position: fixed; left: 0; right: 0; top: 0; box-shadow: 1px 0 3px rgba(0,0,0,0.1); line-height: 44px;}
.navbar .left, .navbar .right, .navbar .center{ height: 44px; z-index: 2;}
.navbar .center{ position: absolute; left: 50%; top: 0; right: 0; width: 50%; margin-left: -25%; text-align: center; z-index: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/*tab_toolbar bottombar底部工具栏*/
.tab_toolbar, .bottombar{ height: 50px; position: fixed; left: 0; bottom: 0; width: 100%; z-index: 10; background-color: #fff; box-shadow: -1px 0 5px rgba(0,0,0,0.15);}
.tab_toolbar .tag, .tab_toolbar .tab_label{ display: block; font-size: 12px; line-height: normal;}

/*tab_sort 分类tab*/
.tab_sort .tab_link{ padding: 10px; border: 1px solid #e6e6e6; border-left: none; background-color: #fff; font-size: 18px; color: #4d4d4d; text-align: center;}

/*list_block_daytask 每日任务*/
.list_block_daytask .list_item{ width: 33.33%; padding: 10px;}
.list_block_daytask .tag{ opacity: 1;}
.list_block_daytask .circle{ display: inline-block; width: 80px; height: 80px; background-color: #ffccd5; border-radius: 50%; -webkit-border-radius: 50%; text-align: center;}
.list_block_daytask .circle .tag{ margin-top: 16px;}
.list_block_daytask .scoreNum{ font-size: 18px; color: #fa5a5a;}
.list_block_daytask .scoreNum .tag{ opacity: 0.2; margin-right: 5px; top: 1px;}
.list_block_daytask .circle.success{ background-color: #17bf36;}

/*list_block_service 服务*/
.list_block_service .list_item:not(:last-child){ margin-bottom: 10px;}
.list_block_service .item_media .circle{ width: 70px; height: 70px; padding: 10px; border: 1px solid #ffccd5; color: #ff8097; font-size: 16px;}
.list_block_service .buttons_item{ width: 50%; padding: 5px;}

/*list_block_coupon 体验卡*/
.list_block_coupon .list_item{ background-color: #fbf0f2; border: 1px solid #ffbeca; border-radius: 5px; position: relative;}
.list_block_coupon .list_item:not(:last-child){ margin-bottom: 10px;}
.list_block_coupon .item_media{ font-size: 48px; color: #ffbeca; padding-left: 10px; padding-right: 10px;}
.list_block_coupon .item_media em{ font-style: normal; font-size: 12px;}
.list_block_coupon .item_inner{ min-height: 96px; border-left: 1px solid #ffbeca;}
.list_block_coupon .item_title{ color: #ffbeca; padding-top: 5px;}
.list_block_coupon .list_item:before{ content: ""; position: absolute; left: 0; top: 0; bottom: 0; height: 100%; width: 10px; background: radial-gradient( transparent 0px, transparent 6px, #ffbeca 4px, #ffbeca ); background-size: 18px 18px; background-position: -35px -20px;}
.list_block_coupon .idcode{ position: absolute; top: 0; right: 0; font-size: 12px; padding: 0 5px;}

/*primary色-体验卡*/
.list_block_coupon .list_item.primary{ background-color: #f2f7fd; border-color: #95c2f8;}
.list_block_coupon .list_item.primary .item_media{ color: #95c2f8;}
.list_block_coupon .list_item.primary .item_inner{ border-color: #95c2f8;}
.list_block_coupon .list_item.primary .item_title{ color: #95c2f8;}
.list_block_coupon .list_item.primary:before{ background: radial-gradient( transparent 0px, transparent 6px, #95c2f8 4px, #95c2f8 ); background-size: 18px 18px; background-position: -35px -20px;}

/*无效-体验卡*/
.list_block_coupon .list_item.no{ background-color: #f7f7f7; border-color: #dedede;}
.list_block_coupon .list_item.no .item_media{ color: #dedede;}
.list_block_coupon .list_item.no .item_inner{ border-color: #dedede;}
.list_block_coupon .list_item.no .item_title{ color: #dedede;}
.list_block_coupon .list_item.no:before{ background: radial-gradient( transparent 0px, transparent 6px, #dedede 4px, #dedede ); background-size: 18px 18px; background-position: -35px -20px;}

/*list_block_grid 格子*/
.list_block_grid{ background-color: #fff;}
.list_block_grid .tag{ opacity: 1;}
.list_block_grid .grid_text{ padding-left: 34px;}

/*swiper*/
.swiper-container{ width: 100%; height: auto; background-color: #eee;}
.swiper-slide{ text-align: center; font-size: 18px; background: #fff;  display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.swiper-slide img{ width: 100%; height: auto;}

/*img_list图片列表-九宫格*/
.img_list .img_item{ width:30%; height: 80px; width:-webkit-calc(100%/3 - 20px); width: calc((100% - 20px)/3); overflow: hidden; float: left; margin: 0 10px 10px 0; position: relative; background-color: #e5e5e5;}
.img_list .img_item:nth-child(3n){ margin-right: 0;}
.img_list .img_item img{ width: 100%; height: auto;}
.img_list .img_item .delete{ position: absolute; top: 0; right: 0; width: 24px; height: 24px; background-color: #000; color: #fff; text-align: center; line-height: 24px; font-size: 24px;}

/*多维组图片滑动展示*/
.sliderMulti{display: block; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: #000; overflow: hidden; z-index:99;}
.sliderMulti ul.box li{ list-style: none; float: left; margin-right: 10px; text-align: center; position: relative;}
.sliderMulti ul.box li img{ max-width: 100%; width: auto;}
.sliderMulti ul.box{ position: absolute; left: 0; top: 0;}
.sliderPages{ position: absolute; z-index: 1; width: 100%; left: 0; bottom: 0; padding: 10px 0 ; text-align: center;}
.sliderPages .circle{ display: inline-block; width: 5px; height: 5px; overflow: hidden; border-radius: 50%; -webkit-border-radius: 50%; background-color: #999; margin: 0 3px;}
.sliderPages .circle.active{ background-color: #fff;}

/*价格*/
.priceNew{ font-size: 18px; color: #f186a2;}
.priceNew em{ font-style: normal; font-size: 12px;}
.priceOld{ color: #999; text-decoration: line-through;}

/*myscore-我的积分*/
.myscore{ font-size: 16px; color: #505050; }
.myscore span.num{ font-size: 32px; color: #fa5a5a; position: relative;}
.myscore em.tag{ vertical-align: middle; margin-right: 8px; position: relative; top: -2px; opacity: 0.2;}
.myscore .button{ background-color: #fa5a5a; border-color: #fa5a5a; font-size: 18px; color: #fff; border-radius: 20px; -webkit-border-radius: 20px; padding: 8px 30px;}
.myscore .button:active{ background-color: #fc7373;}

/*我的头部*/
.uctop{ position: relative;}
.uctop .uctop_bg{ width: 100%; height: 176px; overflow: hidden;}
.uctop .uctop_inner{ position: absolute; left: 0; top:0; right: 0; bottom: 0; width: 100%; height: 100%;}
.uctop .user{ position: absolute; text-align: center; width: 100%; top: 50%; margin-top: -40px;}
.uctop .user_head{ width: 80px; height: 80px; display: block; margin: 0 auto; border: 2px solid #fff; border-radius: 50%;}
.uctop .buttonSet{ position: absolute; top: 5px; right: 5px;}

/*detail*/
.detail_header{ text-align: center; position: relative; margin-bottom: 10px;}
.detail_header h4{ line-height: 150%;}
.detail_desc{ font-size: 16px; border: 1px solid #d9d9d9; padding: 10px; margin-bottom: 10px; background-color: #ededed;}

/*navbar*/
.navbar .collapse{ display: none;}
.navbar .collapse .buttons_block{ box-shadow: 0 2px 7px rgba(0, 0, 0, 0.18); }
.navbar .collapse .buttons_item{ display: block; width: 100%; background-color: #fff; color: #1a1a1a; text-align: center; line-height: 44px; position: relative;}
.navbar .collapse .buttons_item:not(:last-child):after{ content: " "; position: absolute; width: 100%; height: 1px; background-color: #F2F2F2; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0;left: 0; bottom: 0;}
.navbar .button{ border-color: #eee;}

/*面板panel-覆盖*/
.panel, .panel .panel_box{ -webkit-transition-duration: 300ms; transition-duration: 300ms;}
.panel{ z-index: 1000; display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0);}
.panel .panel_box{ background: #fff; box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); position: absolute; width: 260px; height: 100%; overflow: hidden; padding-top: 44px; z-index: 10;}
.panel_header{ background: #f94a6a; color: #fff; font-size: 18px; position: absolute; left: 0; top: 0; right: 0; z-index: 10;}
.panel_header h4{ font-weight: 500; text-align: center; margin: 0 16px; position: relative; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 44px;}
.panel .panel_content{ width: 100%; overflow: auto; -webkit-overflow-scrolling: touch; height: 100%;}
.panel_close{ font-size: 32px; padding: 0 10px; font-weight: 500; height: 44px;}

/*弹出popover-菜单*/
.popover, .popover .popover_box{ -webkit-transition-duration: 300ms; transition-duration: 300ms;}
.popover{ z-index: 1000; display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%;}
.popover .popover_box{ background: #fff; position: absolute; z-index: 10; width: 240px; -webkit-border-radius: 7px; border-radius: 7px;}
.popover .buttons_item{ padding: 0 15px; text-align: center; color: #1a1a1a; display: block; line-height: 43px; position: relative;}
.popover .buttons_item:not(:last-child):after{ content: " "; position: absolute; width: 100%; height: 1px; background-color: #d9d9d9; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0;left: 0; bottom: 0;}

.popover_angle{ width: 26px; height: 26px; position: absolute; z-index: 100;  overflow: hidden;}
.popover_angle:after { content: ' '; background: rgba(255, 255, 255, 0.95); width: 26px; height: 26px; position: absolute; left: 0; border-radius: 3px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}

/*顶上,顶左,顶右*/
.popover_angle.topleft:after, .popover_angle.topcenter:after, .popover_angle.topright:after{ top: 19px;}
.popover_angle.topleft{ top: -26px; left: 10px;}
.popover_angle.topcenter{ top: -26px; left: 50%; margin-left: -13px;}
.popover_angle.topright{ top: -26px; right: 10px;}
/*底上,底左,底右*/
.popover_angle.bottomleft:after, .popover_angle.bottomcenter:after, .popover_angle.bottomright:after{ top: -19px; }
.popover_angle.bottomleft{ top: 100%; left: 10px;}
.popover_angle.bottomcenter{ top: 100%; left: 50%; margin-left: -13px;}
.popover_angle.bottomright{ top: 100%; right: 10px;}

/*功能菜单 actionsheet*/
.actionsheet{ z-index: 1000; display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4);}
.actionsheet_box { position:absolute; left: 0; bottom: 0; z-index: 10; -webkit-backface-visibility: hidden; backface-visibility: hidden; width: 100%; background-color: #efeff4; }
.actionsheet a { display: block; position: relative; padding: 10px 0; text-align: center; font-size: 1.8rem !important; color: #333; background-color: #fff;}
.actionsheet_menu a+a:before { content: " "; position: absolute; left: 0; top: 0; width: 100%; height: 1px; border-top: 1px solid #D9D9D9; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scaleY(0.5); -ms-transform: scaleY(0.5); transform: scaleY(0.5);}
.actionsheet_cancel { margin-top: 6px; background-color: #fff;}

/*模态框 Modal*/
.modal, .modal_box{ -webkit-transition-duration: 300ms; transition-duration: 300ms;}
.modal{ z-index: 1000; display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0);}
.modal_box{ background: #fff; box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); position: absolute; z-index: 10; width: 260px; }
.modal_header, .modal_content, .modal_footer{ position: relative;}
.modal_header h4{ font-weight: 500; text-align: center; margin: 0 16px; position: relative; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 44px;}
.modal_content{ max-height: 320px; overflow-y: auto; line-height: 1.5; word-wrap: break-word; -webkit-overflow-scrolling: touch; }
.modal_close{ display: block; cursor: pointer; font-size: 24px; font-weight: bold; width: 28px; height: 28px; line-height: 26px; position:absolute; top: -15px; right: -15px; border-radius: 50%; -webkit-border-radius: 50%;  background-color: #ededed; border: 1px solid #ededed; color: #616161; text-align: center; z-index: 10;}

/*提示对话框 dialog*/
.dialog, .dialog_box{ -webkit-transition-duration: 300ms; transition-duration: 300ms;}
.dialog{ position: fixed; width: 100%; height: 100%; left: 0; top: 0; right: 0; background-color: rgba(0,0,0,0); /*display: -webkit-flex; -webkit-justify-content: center; -webkit-align-items: center;*/}
.dialog_box{ padding: 10px;  border-radius: 8px; -webkit-border-radius: 8px; background-color: rgba(0,0,0,0.8); text-align: center; color: #fff; position: absolute; z-index: 10;}
.dialog_header .iconfont{ color: #fff; }
.dialog_footer button+button{ margin-left: 8px;}

/*所有层transition动画效果*/
.duration{ -webkit-transition-duration: 300ms; transition-duration: 300ms;}
.linear{ -webkit-transition-timing-function: linear; animation-timing-function: linear; }
.ease{ -webkit-transition-timing-function: ease; animation-timing-function: ease; }
.ease-in{ -webkit-transition-timing-function: ease-in; animation-timing-function: ease-in; }
.ease-out{ -webkit-transition-timing-function: clinear; animation-timing-function: ease-out; }
.ease-in-out{ -webkit-transition-timing-function: clinear; animation-timing-function: ease-in-out; }
.easing{ -webkit-transition-timing-function: cubic-bezier(0.4, 0.4, 0.25, 1.35); transition-timing-function: cubic-bezier(0.4, 0.4, 0.25, 1.35);}

.mask{ background-color: rgba(0,0,0,0);}
.in .mask{ background-color: rgba(0,0,0,0.4);}

.fade{ background-color: rgba(0,0,0,0);}
.fade > div[class*=_box]{ opacity: 0; }
.fade.in{ background-color: rgba(0,0,0,0.4);}
.fade.in > div[class*=_box]{ opacity:1;}

.slideDown{ background-color: rgba(0,0,0,0);}
.slideDown > div[class*=_box]{ opacity: 0; -webkit-transform: translate3d(0, -60px, 0); transform: translate3d(0, -60px, 0);}
.slideDown.in{ background-color: rgba(0,0,0,0.4); }
.slideDown.in > div[class*=_box]{ opacity:1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}

.slideUp{ background-color: rgba(0,0,0,0);}
.slideUp > div[class*=_box]{ opacity: 0; -webkit-transform: translate3d(0, 60px, 0); transform: translate3d(0, 60px, 0);}
.slideUp.in{ background-color: rgba(0,0,0,0.4); }
.slideUp.in > div[class*=_box]{ opacity:1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}

.slideLeft{ background-color: rgba(0,0,0,0);}
.slideLeft > div[class*=_box]{ opacity: 0; -webkit-transform: translate3d(60px, 0, 0); transform: translate3d(60px, 0, 0);}
.slideLeft.in{ background-color: rgba(0,0,0,0.4); }
.slideLeft.in > div[class*=_box]{ opacity:1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}

.slideRight{ background-color: rgba(0,0,0,0);}
.slideRight > div[class*=_box]{ opacity: 0; -webkit-transform: translate3d(-60px, 0, 0); transform: translate3d(-60px, 0, 0);}
.slideRight.in{ background-color: rgba(0,0,0,0.4); }
.slideRight.in > div[class*=_box]{ opacity:1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}

.zoom{ background-color: rgba(0,0,0,0);}
.zoom > div[class*=_box]{ opacity: 0; -webkit-transform: scale3d(0, 0, 0); transform: scale3d(0, 0, 0);}
.zoom.in{ background-color: rgba(0,0,0,0.4); }
.zoom.in > div[class*=_box]{ opacity:1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1);}

/*--transition--animation------------------------------------*/
/*transition*/
.t_all{-webkit-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out}
.t_fade{ -webkit-transition: opacity .15s linear; -o-transition: opacity .15s linear; transition: opacity .15s linear }
.t_transform{ -webkit-transition: -webkit-transform 0.35s ease-in-out; -o-transition: -o-transform 0.35s ease-in-out; transition: transform 0.35s ease-in-out;}
.t_transform_fade{ -webkit-transition: -webkit-transform 0.55s ease-in-out, opacity 0.55s linear; -o-transition: -o-transform 0.55s ease-in-out, opacity 0.55s linear; transition: transform 0.55s ease-in-out, opacity .55s linear;}

.t_height{ -webkit-transition: height .15s ease, visibility .15s ease; -o-transition: height .15s ease, visibility .15s ease; transition: height .15s ease, visibility .15s ease }

/*keyframes animation*/
/*旋转*/
@-webkit-keyframes an_rotate {
    0%{ transform: rotate(0deg); -webkit-transform: rotate(0deg); }
    100%{ transform: rotate(360deg); -webkit-transform: rotate(360deg);}
}
@keyframes an_rotate {
    0%{ transform: rotate(0deg); -webkit-transform: rotate(0deg);}
    100%{ transform: rotate(360deg); -webkit-transform: rotate(360deg);}
}
.an_rotate { -webkit-animation: an_rotate 0.8s infinite linear; animation: an_rotate 0.8s infinite linear;}

/*图片loading*/
@-webkit-keyframes an_loading {
    0% { -webkit-transform: rotate3d(0, 0, 1, 0deg); }
    100% { -webkit-transform: rotate3d(0, 0, 1, 360deg); }
}
@keyframes an_loading {
    0% { -webkit-transform: rotate3d(0, 0, 1, 0deg); }
    100% { -webkit-transform: rotate3d(0, 0, 1, 360deg); }
}
.an_loading{ -webkit-animation: an_loading 1s steps(12, end) infinite; animation: an_loading 1s steps(12, end) infinite;}

/*点赞+1*/
@-webkit-keyframes an_vote {
    0% { opacity: 0; -webkit-transform: translateY(0px) scale(0.5); }
    70% { opacity: 1; -webkit-transform: translateY(-30px) scale(1.8);  }
    100% { opacity: 0; -webkit-transform: translateY(-50px) scale(0.5); }
}
@-moz-keyframes an_vote {
    0% { opacity: 0; -moz-transform: translateY(0px) scale(0.5); }
    70% { opacity: 1; -moz-transform: translateY(-30px) scale(1.8);  }
    100% { opacity: 0; -moz-transform: translateY(-50px) scale(0.5); }
}
.an_vote{
    -webkit-animation: an_vote 1000ms 0ms cubic-bezier(0, 0, 0, 1) both;
    -moz-animation: an_vote 1000ms 0ms cubic-bezier(0, 0, 0, 1) both;
}
/*条纹*/
@-webkit-keyframes an_striped {
    from {background-position: 40px 0;}
    to {background-position: 0 0;}
}
@keyframes an_striped {
    from {background-position: 40px 0;}
    to {background-position: 0 0;}
}
.an_striped{ background-size: 20px 20px; background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);/* border-color: #f0ad4e; background-color:#f0ad4e; color: #fff;*/ animation: an_striped 1s linear infinite; -webkit-animation: an_striped 1s linear infinite;}

/*抖动特效an_bounce*/
@-webkit-keyframes an_bounce {
    0%, 100% { transform: scale(1); -webkit-transform: scale(1);}
    20% { transform: scale(1.3);  -webkit-transform: scale(1.3);}
    50% { transform: scale(1.5); -webkit-transform: scale(1.5);}
    61% { transform: scale(0.6); -webkit-transform: scale(0.6);}
}
@keyframes an_bounce {
    0%, 100% { transform: scale(1); -webkit-transform: scale(1);}
    20% { transform: scale(1.3);  -webkit-transform: scale(1.3);}
    50% { transform: scale(1.5); -webkit-transform: scale(1.5);}
    61% { transform: scale(0.6); -webkit-transform: scale(0.6);}
}
.an_bounce{ -webkit-animation: an_bounce 0.65s 1 ease-in-out; animation: an_bounce 0.65s 1 ease-in-out;}

/*向上渐出 an_fadeInUp*/
@-webkit-keyframes an_fadeInUp {
    0% { opacity: 0; -webkit-transform: translateY(200px) }
    100% { opacity: 1; -webkit-transform: translateY(0px) }
}
@-moz-keyframes an_fadeInUp {
    0% { opacity: 0; -moz-transform: translateY(200px)  }
    100% { opacity: 1; -moz-transform: translateY(0) }
}
.an_fadeInUp{
    -webkit-animation: an_fadeInUp 300ms 0ms ease-in-out both;
    -moz-animation: an_fadeInUp 300ms 0ms ease-in-out both;
}

/*向下渐出 an_fadeInDown*/
@-webkit-keyframes an_fadeInDown {
    0% { opacity: 0; -webkit-transform: translateY(-200px) }
    100% { opacity: 1; -webkit-transform: translateY(0px) }
}
@-moz-keyframes an_fadeInDown {
    0% { opacity: 0; -moz-transform: translateY(-200px)  }
    100% { opacity: 1; -moz-transform: translateY(0) }
}
.an_fadeInDown{
    -webkit-animation: an_fadeInDown 300ms 0ms ease-in-out both;
    -moz-animation: an_fadeInDown 300ms 0ms ease-in-out both;
}

/*放大跳出 an_bounceIn*/
@-webkit-keyframes an_bounceIn {
    0% { opacity: 0; -webkit-transform: scale(.5) }
    100% { opacity: 1; -webkit-transform: scale(1) }
}
@-moz-keyframes an_bounceIn {
    0% { opacity: 0; -moz-transform: scale(.5) }
    100% { opacity: 1; -moz-transform: scale(1) }
}
.an_bounceIn{
    -webkit-animation: an_bounceIn 300ms 0ms ease both;
    -moz-animation: an_bounceIn 300ms 0ms ease both
}

/*滑进*/
@-webkit-keyframes an_slideIn {
    0% { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); opacity: 0 }
    to { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1 }
}
@keyframes an_slideIn {
    0% { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); opacity: 0 }
    to { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1 }
}
.an_slideIn { -webkit-animation: an_slideIn .3s forwards; animation: an_slideIn .3s forwards }

/*滑出*/
@-webkit-keyframes an_slideOut {
    0% { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1 }
    to { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); opacity: 0 }
}
@keyframes an_slideOut {
    0% { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1 }
    to { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); opacity: 0 }
}
.an_slideOut { -webkit-animation: an_slideOut .3s forwards; animation: an_slideOut .3s forwards }