/* ==========================================================================
   reset
   ========================================================================== */

* {
    user-select: none;
}

html body {
    box-sizing: border-box;
    margin: 0;
    background-color: #f5f5f5;
}

body,
div,
p,
span,
a,
img,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
table,
thead,
tbody,
tr,
td,
th {
    padding: 0;
    margin: 0;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

a {
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}

img[src=""],
img:not([src]) {
    opacity: 0;
}

/* ==========================================================================
     工具样式
     ========================================================================== */

.fixed {
    position: fixed;
}

.abs {
    position: absolute;
}

.rel {
    position: relative;
}

.center {
    margin: 0 auto;
}

.fl {
    float: left;
}

.fr {
    float: right;
}

.ovh {
    overflow: hidden;
}

.clearfix::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
}

.tc {
    text-align: center;
}

.tr {
    text-align: right;
}

.tl {
    text-align: left;
}

.vt {
    vertical-align: top;
}

.vm {
    vertical-align: middle;
}

.vb {
    vertical-align: bottom;
}

.bb {
    box-sizing: border-box;
}

.db {
    display: block;
}

.dib {
    display: inline-block;
}

.df {
    display: flex;
}

.jcc {
    justify-content: center;
}

.jcsb {
    justify-content: space-between;
}

.aic {
    align-items: center;
}

.dg {
    display: grid;
}

.dn {
    display: none;
}

.vh {
    visibility: hidden;
}

.bn {
    border-bottom: none !important;
}

.ell {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mell {
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cp {
    cursor: pointer;
}

.bcfff {
    background: #fff;
}

.c222 {
    color: #222;
}

.c333 {
    color: #333;
}

.c666 {
    color: #666;
}

.c999 {
    color: #999;
}

.cRed {
    color: #C3272B;
}

/*主题文字、背景、边框颜色*/

.cfff {
    color: #fff;
}

.c000 {
    color: #000;
}

.ccc {
    color: #ccc;
}

.red {
    color: #FF5C5C;
}

/*常用字号*/
.fwb {
    font-weight: bold;
}

.fwn {
    font-weight: normal;
}

.f12 {
    font-size: 1.667vw;
}

.f14 {
    font-size: 1.944vw;
}

.f16 {
    font-size: 2.222vw;
}

.f18 {
    font-size: 2.5vw;
}

.f20 {
    font-size: 2.778vw;
}

.f22 {
    font-size: 3.056vw;
}

.f24 {
    font-size: 3.333vw;
}

.f26 {
    font-size: 3.611vw;
}

.f28 {
    font-size: 3.889vw;
}

.f30 {
    font-size: 4.167vw;
}

.f32 {
    font-size: 4.444vw;
}

.f34 {
    font-size: 4.722vw;
}

.f36 {
    font-size: 5vw;
}

.f38 {
    font-size: 5.278vw;
}

.f40 {
    font-size: 5.556vw;
}

.f44 {
    font-size: 6.111vw;
}

.f48 {
    font-size: 6.667vw;
}

.f50 {
    font-size: 6.944vw;
}

.f52 {
    font-size: 7.222vw;
}

.slide-bar {
    position: fixed;
    right: 1.94vw;
    top: 50%;
    z-index: 99999;
}

.slide-bar .cs-link {
    margin-bottom: 22.94vw;
    display: none;
}

.slide-bar a.ntt img {
    width: 11.11vw;
}

.slide-bar a.ntt {
    margin-bottom: 3.47vw;
    display: none;
}

.flow {
    margin-bottom: 3.47vw;
}

.toTop,
.flow {
    width: 11.11vw;
    height: 11.11vw;
    background: rgba(0, 0, 0, .62);
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.16);
    border-radius: 50%;
    text-align: center;
    font-size: 2.78vw;
    font-weight: 400;
    color: #fff;
    line-height: 3.89vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.toTop {
    display: none;
}

.toTop img {
    width: 5.14vw;
}

.flow img {
    width: 5.56vw;
}

.flow-box {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(3, 3, 3, .54);
}

.flow-box .flow-cont {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 73.61vw;
    padding: 4.17vw;
    box-sizing: border-box;
    background: #fff;
    border-radius: 1.11vw;
}

.flow-box .flow-cont .title {
    font-size: 3.89vw;
    font-weight: 600;
    color: #333;
    text-align: center;
    margin-bottom: 4.17vw;
}

.flow-box .flow-cont .flow-msg {
    font-size: 3.61vw;
    font-weight: 400;
    color: #333;
    margin-bottom: 3.33vw;
    line-height: 5.17vw;
}

.flow-box .flow-cont .flow-msg span {
    color: #ac0011;
}

.flow-box .flow-cont img {
    width: 100%;
    margin-bottom: 4.17vw;
}

.flow-box .flow-btn {
    width: 65.28vw;
    height: 9.72vw;
    background: #e04f4c;
    border-radius: 1.11vw;
    font-size: 4.17vw;
    font-weight: 400;
    color: #fff;
}

.flow-box .flow-cont .flow-close {
    position: absolute;
    top: -8.5vw;
    right: 0;
    width: 6.67vw;
    height: 6.67vw;
}

.slide-bar a {
    display: flex;
    text-align: center;
    margin-bottom: 1.39vw;
}

.slide-bar a img {
    width: 16.67vw;
    height: 16.67vw;
}

.toTop,
.flow {
    margin-left: auto;
    margin-right: auto;
}


.header-box {
    background-color: #C3272B;
    width: 100vw;
    height: 13.8889vw;
    color: #fff;
    font-size: 5vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.fotter-tab {
    position: fixed;
    bottom: 0;
    width: 100vw;
    height: 17.7778vw;
    box-sizing: border-box;
    padding: 2.7778vw;
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: #fff;
    z-index: 8;
    /* for ie */
    /*font: 12px/1 Tahoma, Helvetica, Arial, "宋体", sans-serif;*/
    font: 12px/1 "微软雅黑", Tahoma, Helvetica, Arial, sans-serif;
    /* 用 ascii 字符表示，使得在任何编码下都无问题 */
}

.fotter-item {
    font-size: 3.8889vw;
    color: #000;
    text-align: center;
}

.fotter-item-active,
.fotter-item.active {
    color: #C3272B;
}

.fotter-tab img {
    width: 8.3333vw;
    height: 8.3333vw;
    filter: brightness(0);
    vertical-align: top;
    border: none;
}

.fotter-tab a {
    text-decoration: none;
    outline: none;
}

.fotter-tab a:visited {
    text-decoration: none;
    outline: none;
}

.fotter-tab a:hover {
    text-decoration: none;
    outline: none;
}

.fotter-tab a:active {
    text-decoration: none;
    outline: none;
}

.fotter-tab a:focus {
    text-decoration: none;
    outline: none;
}

.fotter-tab .fotter-item.active img {
    filter: brightness(1)
}

.fotter-tab .fotter-item:last-child {
    display: none;
}


/* 重新测算按钮 */
.recalculation {
    text-align: center;
    margin-top: 5.5556vw;
}

.recalculation button {
    display: inline-block;
    text-decoration: none;
    border: none;
    background-color: #C3272B;
    border-radius: 1.1111vw;
    width: 38.8889vw;
    height: 9.7222vw;
    line-height: 9.7333vw;
    font-size: 4.4444vw;
    color: #fff;
}

.recalculation a {
    display: inline-block;
    text-decoration: none;
    border: none;
    background-color: #C3272B;
    border-radius: 1.1111vw;
    width: 38.8889vw;
    height: 9.7222vw;
    line-height: 9.7333vw;
    font-size: 4.4444vw;
    color: #fff;
}

.explain {
    font-size: 3.3333vw;
    color: #666;
    line-height: 4.5833vw;
    margin: 2.7778vw 0;
}



/* 五秒后显示弹窗广告 */
.ad-pop-five {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 111111;
    background: rgba(0, 0, 0, 0.5);
    left: -100%;
}

.ad-pop-five-inner {
    position: relative;
    padding: 8vw 0 4vw;
    width: 84vw;
    background-color: #ffffff;
    border-radius: 10px;
}

.ad-pop-five .ad-content {
    width: 100%;
}

.ad-pop-five .ad-pop-five-close {
    position: absolute;
    right: 8px;
    top: 3px;
    width: 6.5vw;
}

.ad-pop-five-inner .cont {
    padding-left: 5.3333vw;
}

.ad-pop-five-inner .cont a {
    font-size: 3.2vw;
    color: #333;
    position: relative;
}

.ad-pop-five-inner .cont a::after {
    content: '';
    display: block;
    width: .9667vw;
    height: .9667vw;
    background-color: #333;
    border-radius: 50%;
    position: absolute;
    left: -2.2vw;
    top: 1.9vw;
}
