html,body{ width: 100%; height: 100%; padding: 0; margin: 0; background: none; font-size: 14px; }
body,input,button,select,textarea,pre{font-family:"微软雅黑",Helvetica,STHeiti,Droid Sans Fallback;padding: 0; margin: 0;}
input,button,select,textarea{ border: none; outline: none; background-color: transparent; -webkit-tap-highlight-color: transparent; }
textarea{ resize: none; }
a{ text-decoration: none; }
ul, li{ list-style: none; padding: 0; margin: 0; }
table{ border-collapse: collapse; border-spacing: 0; word-break: break-all; }
table th, table td{ vertical-align: middle; text-align: center; font-weight: normal; }
p, h1, h2, h3, h4, h5, h6{ margin: 0; }
*{ box-sizing: border-box; }


@font-face {
    font-family: annabelle; src: url("../img/customized-icon/fonts/annabelle.ttf") format("opentype");
}
@font-face {
    font-family: dancing-script; src: url("../img/customized-icon/fonts/dancing-script.ttf") format("opentype");
}
@font-face {
    font-family: engagement; src: url("../img/customized-icon/fonts/engagement.ttf") format("opentype");
}
@font-face {
    font-family: fineliner; src: url("../img/customized-icon/fonts/fineliner.ttf") format("opentype");
}
@font-face {
    font-family: jiang-nan-shou-shu; src: url("../img/customized-icon/fonts/jiang-nan-shou-shu.ttf") format("opentype");
}
@font-face {
    font-family: jiu-zhou-zhen-shu; src: url("../img/customized-icon/fonts/jiu-zhou-zhen-shu.ttf") format("opentype");
}
@font-face {
    font-family: lang-yuan; src: url("../img/customized-icon/fonts/lang-yuan.ttf") format("opentype");
}
@font-face {
    font-family: meng-qu-xiao-yu; src: url("../img/customized-icon/fonts/meng-qu-xiao-yu.ttf") format("opentype");
}
@font-face {
    font-family: norican; src: url("../img/customized-icon/fonts/norican.ttf") format("opentype");
}
@font-face {
    font-family: shi-tou; src: url("../img/customized-icon/fonts/shi-tou.ttf") format("opentype");
}
@font-face {
    font-family: tu-ya; src: url("../img/customized-icon/fonts/tu-ya.ttf") format("opentype");
}
@font-face {
    font-family: wu-lin-jiang-hu; src: url("../img/customized-icon/fonts/wu-lin-jiang-hu.ttf") format("opentype");
}

body.hidden{ overflow: hidden; }
body { -webkit-text-size-adjust: 100% !important; }
.wrapper{ width: 100%; height: 100%; padding-top: 0.88rem; overflow: hidden; position: absolute; left: 0; top: 0; z-index: 1; }
.wrapper-container{ width: 100%; height: 100%; }
.wrapper-box{width: 100%; height: 100%; overflow: hidden; position: absolute; left: 0; top: 0; z-index: 1;}
.wrapper-scroll{width: 110%; height: 100%; -webkit-overflow-scrolling: touch; overflow-x: hidden; overflow-y: scroll; position: relative; padding-right: 10%; padding-top: 0.88rem;}
::-webkit-scrollbar{ display: none; }
body.disabled-ios-touch .wrapper-scroll{ -webkit-overflow-scrolling: auto; }
.content{width: 100%;}
.wrapper-box.white, .wrapper.white{ background-color: #fff; }
.wrapper-box.search{ background-color: #edf1f2; }
.wrapper-scroll.full, .wrapper.full{ padding-top: 0; }
.box-shadow{box-shadow: 0 0 0.2rem rgba(153,153,153,0.3);}
.clearfix:after{ clear: both; content: ""; display: block; height: 0; }
.flexBox{ display: flex; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; }
.flexBox-center{ justify-content: center; align-items: center; }
.flexBox-item{ flex: 1; }
.flex-direction{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; }
.flex-column{ flex-flow: column; }
.justify-between{ -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }
.justify-around{ -webkit-box-pack: justify; -webkit-justify-content: space-around; justify-content: space-around; }
.justify-end{ -webkit-box-pack: justify; -webkit-justify-content: flex-end; justify-content: flex-end; }
.justify-start{ -webkit-box-pack: justify; -webkit-justify-content: flex-start; justify-content: flex-start; }
.justify-center{ -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; }
.align-center{ -webkit-box-align: center; -webkit-align-items: center; align-items: center; }
.align-end { -webkit-box-align: end; -webkit-align-items: flex-end; align-items: flex-end; }
.align-start { -webkit-box-align: start; -webkit-align-items: flex-start; align-items: flex-start; }
.image-full{ display: block; width: 100%; height: 100%; }
.image-auto{ margin: auto; width: 100%; height: auto; }
.relative{ position: relative; }
.t-animated{ transition: all 0.3s ease; }
.text-bold{ font-weight: bold; }
.image-width{ width: 100%; display: block; }
.image-height{ height: 100%; }
.image-float{ width: 100%; float: left; }
.image-max{ max-width: 100%; max-height: 100%; }
.text-right{ float: right; }
#app{ width: 100%; height: 100%; }
.hide{ display: none; }
.page-frame-screen{ width: 90%; height: 80%; background-color: #f6f6f6; }
.HeadPlugin-main-screen{ position: absolute; width: 100%; height: 0.88rem; font-size: 0.36rem; z-index: 11; text-align: center; line-height: 0.88rem; left: 0; top: 0; }
.Home-banner-screen{ width: 100%; height: 4.56rem; overflow: hidden; position: relative; }
.Home-main-screen{ width: 100%; }
.Home-item-screen{ float: left; width: 33.333%; height: 2.5rem; border-right: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; text-align: center; }
.app-body-head{ padding-top: 30px; }
.app-body-head-x{ padding-top: 40px; }
.app-body-head-x .RichTextPage-main{ top: 40px!important; }
.text-margin-right-1{ margin-right: 0.1rem; }
.text-margin-1{ margin-left: 0.1rem; }
.text-margin-2{ margin-left: 0.2rem; }
/*.inline-nowrap{ white-space: nowrap; }*/
.inline-nowrap{ display: inline-block; }
.word-break{ word-break: break-all }

@supports (bottom: env(safe-area-inset-bottom)) {
    #app, .ios-bottom-line{
        padding-bottom: env(safe-area-inset-bottom);
    }
}
input[type="search"]{ -webkit-appearance:none; }

/* 页面切换 */
.pageRight-enter-active,.pageRight-leave-active,.pageLeft-enter-active,.pageLeft-leave-active{
    transition: transform .3s ease-in-out;
    transform:translate3d(0,0,0);
}
.pageRight-enter,.pageLeft-leave-to{
    transform:translate3d(100%,0,0);
}
.pageRight-leave-to,.pageLeft-enter{
    transform:translate3d(-100%,0,0);
}

/* 动画 */
.sideRight-enter-active,.sideRight-leave-active{
    transition: transform .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out;
}
.sideRight-enter{
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
}
.sideRight-leave-to{
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
}

.sideLeft-enter-active,.sideLeft-leave-active{
    transition: transform .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out;
}
.sideLeft-enter{
    transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
}
.sideLeft-leave-to{
    transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
}

.sideBottom-enter-active,.sideBottom-leave-active{
    transition: transform .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out;
}
.sideBottom-enter{
    transform: translateY(100%);
    -webkit-transform: translateY(100%);
}
.sideBottom-leave-to{
    transform: translateY(100%);
    -webkit-transform: translateY(100%);
}

.sideTop-enter-active,.sideTop-leave-active{
    transition: transform .3s ease-in-out, opacity 0.3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out, opacity 0.3s ease-in-out;
}
.sideTop-enter{
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    opacity: 0;
}
.sideTop-leave-to{
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    opacity: 0;
}

.popBottom-enter-active,.popBottom-leave-active{
    transition: transform .3s ease-in-out, opacity .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out, opacity .3s ease-in-out;
}
.popBottom-enter{
    transform: translateY(30%);
    -webkit-transform: translateY(30%);
    opacity: 0;
}
.popBottom-leave-to{
    transform: translateY(30%);
    -webkit-transform: translateY(30%);
    opacity: 0;
}

.opacityAnimate-enter-active,.opacityAnimate-leave-active{
    transition: opacity .3s ease-in-out;
    -webkit-transition: opacity .3s ease-in-out;
}
.opacityAnimate-enter{
    opacity: 0;
}
.opacityAnimate-leave-to{
    opacity: 0;
}

.pop-animate{animation-duration: 0.3s;animation-fill-mode: both;animation-iteration-count:1;animation-name: popMove;}
@-webkit-keyframes popMove {
    0% {transform: translateY(30%);-webkit-transform: translateY(30%);opacity:0;}
    100% {transform: translateY(0);-webkit-transform: translateY(0);opacity:1;}
}
@keyframes popMove {
    0% {transform: translateY(30%);-webkit-transform: translateY(30%);opacity:0;}
    100% {transform: translateY(0);-webkit-transform: translateY(0);opacity:1;}
}

.zoomIn{-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;animation-timing-function:ease-in-out;-webkit-animation-timing-function:ease-in-out;-webkit-animation-name: zoomIn;animation-name: zoomIn;}
@-webkit-keyframes zoomIn {
    0% {opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3)}
    50% {opacity: 1}
}
@keyframes zoomIn {
    0% {opacity: 0;-webkit-transform: scale3d(.3, .3, .3);-ms-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3)}
    50% {opacity: 1}
}

.bottom-animate{animation-duration: 0.3s;animation-fill-mode: both;animation-iteration-count:1;animation-name: bottomMove;}
@-webkit-keyframes bottomMove {
    0% {transform: translateY(100%);-webkit-transform: translateY(100%);opacity:0;}
    100% {transform: translateY(0);-webkit-transform: translateY(0);opacity:1;}
}
@keyframes bottomMove {
    0% {transform: translateY(100%);-webkit-transform: translateY(100%);opacity:0;}
    100% {transform: translateY(0);-webkit-transform: translateY(0);opacity:1;}
}

.rotateRight-animate{ animation-duration: 2s; animation-fill-mode: both; animation-iteration-count: infinite; animation-name: rotateRight; animation-timing-function: linear; }
@-webkit-keyframes rotateRight {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@keyframes rotateRight {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.rotateLeft-animate{ animation-duration: 2s; animation-fill-mode: both; animation-iteration-count: infinite; animation-name: rotateLeft; animation-timing-function: linear; }
@-webkit-keyframes rotateLeft {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(-360deg); }
}
@keyframes rotateLeft {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(-360deg); }
}

/* 计算器 */
.inputLine-animate{ -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; animation-iteration-count:infinite; -webkit-animation-iteration-count:infinite; -webkit-animation-name: calculator; animation-name: calculator; }
@-webkit-keyframes calculator {
    0% { -webkit-opacity: 0; opacity: 0; }
    50% { -webkit-opacity: 1; opacity: 1; }
    100% { -webkit-opacity: 0; opacity: 0; }
}

@keyframes calculator {
    0% { -webkit-opacity: 0; opacity: 0; }
    50% { -webkit-opacity: 1; opacity: 1; }
    100% { -webkit-opacity: 0; opacity: 0; }
}