@import url("iconfont.css");
@charset "utf-8";
/*
 * CSS Document
 * name   :base.css v1.0
 * author :tonjay
 * time   :2017-01-01 
 */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border: 0; font-family: inherit; font-size: 100%; font-style: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; }
html { font-size: 62.5%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html,body{ width: 100%; height: 100%; font-size: 10px;}
body{ max-width: 640px; margin: 0 auto;}
*,*:before,*:after{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;-webkit-tap-highlight-color: rgba(0,0,0,0.05);}
body { background: #eee;}
article, aside, details, figcaption, figure, footer, header, main, nav, section { display: block; }
ol, ul { list-style: none;}
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { font-weight: normal; text-align: left; }
th{ text-align:center;}
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes:'"' '"' "'" "'"; }
blockquote { padding: 15px 20px; margin: 15px 0 25px; border-left: 5px solid #F5CC36; background: #f6f6f6; }
img { border: 0; vertical-align: middle; }
@font-face {  }
/*clear clearfix*/
.clearfix:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { zoom: 1; }
/*--------------------------------------------------------------
Typography
--------------------------------------------------------------*/
body, button, input, select, textarea { color: #333; font-family: 'Open Sans', Arial,"microsoft yahei", sans-serif; font-size: 14px; line-height: 1.6; word-wrap: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; }
h1, h2, h3, h4, h5, h6 { color: #222; font-weight: 500; }
h1 { font-size: 1.8em }
h2 { font-size: 1.6em }
h3 { font-size: 1.4em }
h4 { font-size: 1.2em }
h5 { font-size: 1em }
h6 { font-size: 0.9em }
article.post h2, article.post h3, article.post h4, article.post h5 { margin-top: 1.2em; margin-bottom: 0.8em; }
article.post h2 { border-bottom: 2px solid #eee; padding-bottom: 10px; }
article.post h3 { border-bottom: 1px dashed #eee; padding-bottom: 10px; }
b, strong { font-weight:500; }
dfn, cite, em, i { font-style: italic; }
address { margin: 0 0 1.5em; }
pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 1.5rem; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; }
code, kbd, tt, var { font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; }
abbr, acronym { border-bottom: 1px dotted #666; cursor: help; }
mark, ins { background: #fff9c0; text-decoration: none; }
sup, sub { font-size: 75%; height: 0; line-height: 0; position: relative; vertical-align: baseline; }
sup { bottom: 1ex; }
sub { top: .5ex; }
del{ text-decoration: line-through;}
small { font-size: 75%; }
big { font-size: 125%; }
kbd { padding: 2px 4px; margin: 0 6px; font-size: 90%; color: #fff; background-color: #333; border-radius: 3px; -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); font-family: Menlo, Monaco, Consolas, "Courier New", monospace; }
aside.note { display: block; font-size: 14px; margin: 16px 0; padding: 12px 24px 12px 60px; background: #e1f5fe; color: #0288d1; }
aside.note::before { float: left; font: normal normal normal 24px/1 'iconfont'; font-feature-settings: 'liga'; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; word-wrap: normal; margin-left: -36px; margin-top: -3px; color: #039be5; content: '\e62d'; }
/*--------------------------------------------------------------
Elements
--------------------------------------------------------------*/
hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; }
.hasstyle ul, .hasstyle ol { margin: 0 0 1.5em 3em; }
ul,ol,ul li,ol li{ margin: 0; padding: 0; list-style: none;}
.hasstyle ul ,.hasstyle ul li { list-style: disc; }
.hasstyle ol ,.hasstyle ol li { list-style: decimal; }
.hasstyleli > ul, .hasstyle li > ol { margin-bottom: 0; margin-left: 1.5em; }
dt { font-weight: bold; }
dd { margin: 0 1.5em 1.5em; }
figure { margin: 0; }
table { margin: 0 0 1.5em; width: 100%; }
th { font-weight: bold; }

/*--------------------------------------------------------------
Inputs and buttons
--------------------------------------------------------------*/
button, input, select, textarea { font-size:inherit;  margin: 0; padding: 0;  vertical-align: middle;  *vertical-align: middle; -webkit-appearance:none; appearance:none; border: none; outline: none; background: inherit;}
textarea { overflow: auto; vertical-align: top; resize: none;}

/*表单样式*/
.seformCelll{position: relative;}
.seformCelll select{ width: 100%; height: 100%; border: none;}
.seformCelll:after{ content: " ";display: inline-block;-webkit-transform: rotate(135deg);transform: rotate(135deg);height: 6px;width: 6px;border-width: 2px 2px 0 0; border-color: #c8c8cd; border-style: solid; position: relative; top: -2px; position: absolute; top: 50%; right: 15px; margin-top: -6px;}
input[type=radio],input[type=checkbox]{border: 1px solid #ccc; width:18px; height:18px; position: relative;background: #fff;}
input[type=radio]{ border-radius: 50%;}
input[type=radio]:checked{ background: #007339; border: none;}
input[type=checkbox]{border-radius:2px;}
input[type=checkbox]:checked{ border: none; background: #007339;}
input[type=checkbox]:after,input[type=radio]:after{ content:""; display: block; border:1px solid; border-color: transparent transparent #fff #fff; width:8px; height:5px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-75%,-60%) rotate(-45deg);transform: translate(-75%,-60%) rotate(-45deg); -webkit-transform-origin: center top;transform-origin: center top; border-radius:1px;}


/*--------------------------------------------------------------
Links
--------------------------------------------------------------*/
a { color: #444; font-weight: 300; text-decoration: none; }
/*--------------------------------------------------------------
commons
--------------------------------------------------------------*/
.float-box,.black-bg{ left: 0; top: 0; right: 0; bottom: 0;}
.black-bg,.float-mid,.anbox{ position: absolute;}
.float-box{position:fixed; z-index: 9999;}
.black-bg{background:rgba(0,0,0,0.8);}
.float-mid{ left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);}
.anbox{ width: 100%; height: 100%;}
.modle-c{ display: -webkit-box; -webkit-box-align: center;}
.m-auto{ margin-left: auto; margin-right: auto;}

.table { width: 100%; margin-bottom: 1em; border-collapse: collapse;}
.table th, .table td { padding: 10px; border: 1px solid #eee;}
.table.noborder th, .table.noborder td{border:none;}
.table tr:hover{ background:#f5f5f5;}

/****************盒子布局*****************/
[class*=flex]{ display: -webkit-box;display: -webkit-flex;  display: -ms-flexbox; display: flex; /*width: 100%;*/} 
[class*=flex-wrap]{flex-wrap: wrap;}
[class*=flex] .sub{ -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; overflow: hidden;}
[class*=flex-column]{-webkit-flex-direction: column; flex-direction: column;}
[class*=flex-column-c]{justify-content: center;}
[class*=flex-ai]{align-items: center;}
[class*=flex-jb]{justify-content: space-between;}


/****************边框线*****************/
.arrowR,.arrowB,.arrowL,.gridYl,.gridYr,.gridXt,.gridXb,.gridFour,.gridFourRadio,.gridFourCirle{ position: relative;}
.gridYl::before,.gridYr::before,.gridXt::before,.gridXb::before,.gridFour::before,.gridFourRadio::before,.gridFourCirle::before{content:" "; display: block; position: absolute; background:#ececec; box-sizing: border-box;}
.gridYl,.gridYr::before{ width: 1px; top: 0; bottom: 0; -webkit-transform: scale(0.5,1); transform: scale(0.5,1);}
.gridYl::before{ left: 0; -webkit-transform-origin: left center;transform-origin: left center;}
.gridYr::before{ right: 0; -webkit-transform-origin: right center;transform-origin: right center;}
.gridXt::before,.gridXb::before{ height: 1px; right: 0; left: 0; -webkit-transform: scale(1,0.5); transform: scale(1,0.5);}
.gridXt::before{ top: 0; -webkit-transform-origin: top center;transform-origin: top center;}
.gridXb::before{ bottom: 0; -webkit-transform-origin: bottom center;transform-origin: bottom center;}
.gridFour::before,.gridFourCirle::before,.gridFourRadio::before{ width: 200%; border: 1px solid #ececec; height: 200%;-webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transform-origin: 0 0; transform-origin: 0 0; border-radius: 6px; left: 0; top: 0; background: none; pointer-events:none;}
.gridFourRadio::before{ border-radius: 3px;}
.gridFourCirle::before{ border-radius: 100px;}

.arrowR::after,.arrowL::after,.arrowB::after,.arrowT::after{ content: ""; position:absolute; display: block; width: 12px; height: 12px; border:2px solid; border-color:#999 #999 transparent transparent; top: 50%; -webkit-transform:translateY(-50%) scale(0.7) rotate(45deg);transform:translateY(-50%) scale(0.7) rotate(45deg); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; border-radius: 2px;}
.arrowR::after{ right: 10px;}
.arrowL::after{ left: 10px;}
.arrowB::after{ right: 10px; -webkit-transform:translateY(-88%) scale(0.7) rotate(135deg);transform:translateY(-88%) scale(0.7) rotate(135deg);}
.arrowT::after{ right: 10px; -webkit-transform:translateY(-35%) scale(0.7) rotate(-45deg);transform:translateY(-35%) scale(0.7) rotate(-45deg);}

.close{ width: 46px; height: 46px; border-radius: 50%; background: #fff; position: relative; border: 1px solid #eee;}
.close.small{ -webkit-transform: rotate(45deg) scale(0.5);transform: rotate(45deg) scale(0.5);}
.close:before,.close:after{ content: ""; display: block; width: 50%; height: 2px; background: #ccc; border-radius: 2px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);}
.close:before{-webkit-transform: translate(-50%,-50%) rotate(90deg);transform: translate(-50%,-50%) rotate(90deg);}
.close:active{ background: #999;}

html .db{ display: block}
html .din{ display: inline-block;}
html .dn{ display: none;}
.fl { float:left; }
.fr { float:right; }
.tl { text-align:left; }
.tc { text-align:center; }
.tr { text-align:right; }
.max-font { font-size: 2rem }
.large-font { font-size: 1.8rem }
.big-font { font-size: 1.6rem }
.mid-font { font-size: 1.4rem }
.small-font { font-size: 1.2rem }
.min-font { font-size: 1rem }
.pr{position: relative;}


.w100{ width: 100%;}
.h100{ height: 100%;}
.p5{ padding: 5px;}
.p8{ padding: 8px;}
.p10{ padding:10px;}
.p15{ padding:15px;}
.p20{ padding:20px;}
.m5{ margin: 5px;}
.m8{ margin: 8px;}
.m10{ margin:10px;}
.m15{ margin:15px;}
.m20{ margin:20px;}
.mt5{ margin-top:5px;}
.mt8{ margin-top:8px;}
.mt10{ margin-top:10px;}
.mt12{ margin-top:12px;}
.mt15{ margin-top:15px;}
.mt16{ margin-top:16px;}
.mt18{ margin-top:18px;}
.mt20{ margin-top:20px;}
.mr5{ margin-right:5px;}
.mr8{ margin-right:8px;}
.mr10{ margin-right:10px;}
.mr12{ margin-right:12px;}
.mr15{ margin-right:15px;}
.mr16{ margin-right:16px;}
.mr18{ margin-right:18px;}
.mr20{ margin-right:20px;}
.mb5{ margin-bottom:5px;}
.mb8{ margin-bottom:8px;}
.mb10{ margin-bottom:10px;}
.mb12{ margin-bottom:12px;}
.mb15{ margin-bottom:15px;}
.mb16{ margin-bottom:16px;}
.mb18{ margin-bottom:18px;}
.mb20{ margin-bottom:20px;}
.ml5{ margin-left:5px;}
.ml8{ margin-left:8px;}
.ml10{ margin-left:10px;}
.ml12{ margin-left:12px;}
.ml15{ margin-left:15px;}
.ml16{ margin-left:16px;}
.ml18{ margin-left:18px;}
.ml20{ margin-left:20px;}
.pt5{ padding-top:5px;}
.pt8{ padding-top:8px;}
.pt10{ padding-top:10px;}
.pt12{ padding-top:12px;}
.pt15{ padding-top:15px;}
.pt16{ padding-top:16px;}
.pt18{ padding-top:18px;}
.pt20{ padding-top:20px;}
.pr5{ padding-right:5px;}
.pr8{ padding-right:8px;}
.pr10{ padding-right:10px;}
.pr12{ padding-right:12px;}
.pr15{ padding-right:15px;}
.pr16{ padding-right:16px;}
.pr18{ padding-right:18px;}
.pr20{ padding-right:20px;}
.pb5{ padding-bottom:5px;}
.pb8{ padding-bottom:8px;}
.pb10{ padding-bottom:10px;}
.pb12{ padding-bottom:12px;}
.pb15{ padding-bottom:15px;}
.pb16{ padding-bottom:16px;}
.pb18{ padding-bottom:18px;}
.pb20{ padding-bottom:20px;}
.pl5{ padding-left:5px;}
.pl8{ padding-left:8px;}
.pl10{ padding-left:10px;}
.pl12{ padding-left:12px;}
.pl15{ padding-left:15px;}
.pl16{ padding-left:16px;}
.pl18{ padding-left:18px;}
.pl20{ padding-left:20px;}

/* 伪元素 */
.before::before,.after::after{content: '';display: block;position: absolute}


/* 弹框效果 */
.fix{position: fixed;bottom: 0;left: 0;width: 100%;height: 100%;z-index: 9999;-webkit-animation: popupbg 0.2s ease forwards;-webkit-opacity: 0;padding-bottom: 60rpx;}

.fixBg{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, .6);}
.fixScaleBox,.fixTransBox{background: #fff;position: absolute;left:50%;}

/* 移动动画效果 */
.fixTransBox{bottom: 0;-webkit-animation: popup 0.2s ease forwards;-webkit-opacity: 0;-wekbit-transform: translate(-50%,100%);transform: translate(-50%,100%);width: 100%;}

.popup{ -webkit-animation: popupbg 0.2s ease forwards;  -webkit-opacity: 0;}
@-webkit-keyframes popupbg {
  0% { -webkit-opacity: 0;}
  100%{ -webkit-opacity: 1;}
}
.popup .popup-box{ -webkit-animation: popup 0.2s ease forwards;-wekbit-transform: translate(-50%,100%);transform: translate(-50%,100%); -webkit-opacity: 0;}
@-webkit-keyframes popup {
  0% { -wekbit-transform: translate(-50%,100%);transform: translate(-50%,100%); -webkit-opacity: 0;}
  100%{-wekbit-transform: translate(-50%,0%);transform: translate(-50%,0%);-webkit-opacity: 1;}
}

/* 缩放动画效果 */
.fixScaleBox{top: 50%;-webkit-animation: popupp 0.2s ease forwards;-webkit-opacity: 0;-wekbit-transform: translate(-50%,-50%) scale(.01);transform: translate(-50%,-50%) scale(.01);width: 100%;}

.popup .popup-box{ -webkit-animation: popupp 0.2s ease forwards;-wekbit-transform: translate(-50%,-50%) scale(.01);transform: translate(-50%,-50%) scale(.01); -webkit-opacity: 0;}
@-webkit-keyframes popupp {
  0% { -wekbit-transform: translate(-50%,-50%) scale(.01);transform: translate(-50%,-50%) scale(.01); -webkit-opacity: 0;}
  100%{-wekbit-transform: translate(-50%,-50%) scale(1);transform: translate(-50%,-50%) scale(1);-webkit-opacity: 1;}
}


/* 文字省略 */
.lineText,.lineText2,.lineText3{ overflow: hidden;text-overflow: ellipsis;}
.lineText2,.lineText3{ display: -webkit-box; -webkit-box-orient: vertical;box-orient: vertical;}
.lineText{ white-space: nowrap;}
.lineText2{ -webkit-line-clamp: 2;}
.lineText3{ -webkit-line-clamp: 3;}

.bWhite{background: #fff;}

/* 去掉滑条 */
::-webkit-scrollbar {
  width: 0;
  height: 0;
  color: transparent;
}

html .delay2{-webkit-animation-delay: 0.2s;animation-delay: 0.2s;}
html .delay3{-webkit-animation-delay: 0.3s;animation-delay: 0.3s;}
html .delay4{-webkit-animation-delay: 0.4s;animation-delay: 0.4s;}
html .delay5{-webkit-animation-delay: 0.5s;animation-delay: 0.5s;}
html .delay6{-webkit-animation-delay: 0.6s;animation-delay: 0.6s;}
html .delay7{-webkit-animation-delay: 0.7s;animation-delay: 0.7s;}
html .delay8{-webkit-animation-delay: 0.8s;animation-delay: 0.8s;}
html .delay9{-webkit-animation-delay: 0.9s;animation-delay: 0.9s;}
html .delay10{-webkit-animation-delay: 1s;animation-delay: 1s;}
html .delay11{-webkit-animation-delay: 1.1s;animation-delay: 1.1s;}
html .delay12{-webkit-animation-delay: 1.2s;animation-delay: 1.2s;}
html .delay13{-webkit-animation-delay: 1.3s;animation-delay: 1.3s;}
html .delay14{-webkit-animation-delay: 1.4s;animation-delay: 1.4s;}
html .delay15{-webkit-animation-delay: 1.5s;animation-delay: 1.5s;}
html .delay16{-webkit-animation-delay: 1.6s;animation-delay: 1.6s;}
html .delay17{-webkit-animation-delay: 1.7s;animation-delay: 1.7s;}
html .delay18{-webkit-animation-delay: 1.8s;animation-delay: 1.8s;}
html .delay19{-webkit-animation-delay: 1.9s;animation-delay: 1.9s;}
html .delay20{-webkit-animation-delay: 2s;animation-delay: 2s;}
html .delay21{-webkit-animation-delay: 2.1s;animation-delay: 2.1s;}
html .delay22{-webkit-animation-delay: 2.2s;animation-delay: 2.2s;}
html .delay23{-webkit-animation-delay: 2.3s;animation-delay: 2.3s;}
html .delay24{-webkit-animation-delay: 2.4s;animation-delay: 2.4s;}
html .delay25{-webkit-animation-delay: 2.5s;animation-delay: 2.5s;}
html .delay26{-webkit-animation-delay: 2.6s;animation-delay: 2.6s;}

html .du6{-webkit-animation-duration: 0.6s;animation-duration: 0.6s;}
html .du8{-webkit-animation-duration: 0.8s;animation-duration: 0.8s;}
html .du10{-webkit-animation-duration: 1s;animation-duration: 1s;}
html .du12{-webkit-animation-duration: 1.2s;animation-duration: 1.2s;}