@charset "utf-8";
/* common */
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,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
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;
}
html,
body {
    -webkit-text-size-adjust: none;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}
figure {
    margin: 0;
}
body,
button,
input,
select,
textarea {
    font: .75em/1.5 "PingFangSC", "San Francisco", "NotoSans", "Roboto", "STHeiti SC", "microsoft yahei", arial, sans-serif, \5b8b\4f53;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: 400;
}
address,
cite,
dfn,
em,
var {
    font-style: normal;
}
code,
kbd,
pre,
samp {
    font-family: courier new, courier, monospace;
}
small {
    font-size: 12px;
}
ul,
ol {
    list-style: none;
}
a {
    text-decoration: none;
    outline: none;
}
a:hover {
    text-decoration: none;
}
sup {
    vertical-align: text-top;
}
sub {
    vertical-align: text-bottom;
}
fieldset,
img {
    border: 0;
}
img {
    display: block;
    width: 100%;
}
table {
    border-spacing: 0;
    border-collapse: collapse;
}
button,
input,
select,
textarea {
    font-size: 100%;
    outline: none;

    -webkit-appearance: none;
            appearance: none;
}
* {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
}
.flex {
    display: -webkit-box;
    display:    -moz-box;
    display: -webkit-flex;
    display:    -moz-flex;
    display: -ms-flexbox;
    display:         flex;
}
.flex1 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.flex-vc {
    -webkit-align-items: center;
            align-items: center;
    -webkit-box-pack: center;
       -moz-box-pack: center;
    -ms-flex-align: center;
}
.flex-sb {
    -webkit-box-pack: justify;
       -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
            justify-content: space-between;
}
.fl {
    float: left;
}
.fr {
    float: right;
}
.body-wrapper {
    position: relative;
    width: 7.5rem;
    margin: 0 auto;
    font-size: .24rem;
    background: #250000;
}
body {
    margin-bottom: 0 !important;
}
.body-bg {
    color: #250000;
}
.banner {
    position: relative;
}
.banner .act-more {
    position: absolute;
    top: .92rem;
    right: 0;
    width: .85rem;
    height: .61rem;
    background: transparent;
}

.combox {
    position: relative;
    width: 6.93rem;
    margin: 0 auto .3rem;
    border: .02rem solid #960044;
    border-radius: .1rem;
    background: #ffe0b4;
}
.combox:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: .1rem;
    border-radius: .08rem .08rem 0 0;
    background: #f2782a;
}
.title {
    width: 3.63rem;
    height: .53rem;
    margin: 0 auto;
    font-size: .29rem;
    font-weight: 700;
    line-height: .53rem;
    text-align: center;
    color: #fff;
    background: url(../images/title-bg.png) no-repeat;
    -webkit-background-size: 100%;
            background-size: 100%;
    text-shadow: 0 0 1px #000;
}
.bigcon {
    padding: .24rem 0 .3rem .48rem;
    line-height: 1.75;
}
.combox2 {
    padding-bottom: .46rem;
}
.bind-card {
    position: relative;
    width: 6.1rem;
    margin: .62rem auto 0;
}
.bind-card .word-icon {
    position: absolute;
    bottom: .24rem;
    left: 1.56rem;
    width: .19rem;
}
.bind-card .word-icon:nth-of-type(2) {
    left: 2.96rem;
}
.bind-card .word-icon:nth-of-type(3) {
    left: 4.84rem;
}
.bind-card em {
    display: block;
    width: .84rem;
    margin: 0 auto .3rem;
    line-height: 1.75;
}
.bind-card .mb {
    margin-bottom: .24rem;
}
.bind-card .con {
    text-align: center;
}
.bind-card .con-single {
    padding-top: .2rem;
}
.all-step {
    margin: .4rem 0 0 0;
}
.all-step em {
    display: block;
    width: 6.88rem;
    margin: .62rem auto;
}
.step {
    overflow: hidden;
}
.step li {
    float: left;
}
.step li:first-child {
    width: 3.68rem;
    padding-left: .46rem;
}
.step dl {
    overflow: hidden;
}
.step dt {
    float: left;
    margin-right: .1rem;
    font-size: .4rem;
    line-height: 1.1;
    color: #976015;
}
.step dd {
    float: left;
}
.btn {
    overflow: hidden;
    width: 6.93rem;
    margin: .42rem auto 0;
    padding-bottom: .66rem;
}
.btn a {
    display: block;
    width: 3rem;
    height: .72rem;
    border: .02rem solid #be0a00;
    font-size: .3rem;
    font-weight: 700;
    line-height: .72rem;
    text-align: center;
    color: #fff;
    border-radius: .5rem;
    background: linear-gradient(180deg, #ef564d, #a2120a);
    text-shadow: 0 0 1px #000;
}
.add {
    position: fixed;
}
/*.active-note*/
.active-note-bg {
    padding: 0 .4rem;
    background: #fff;
}
.active-note {
    margin: auto;
    padding-bottom: .6rem;
    font-size: .24rem;
    background: #fff;
}

.active-note .con {
    overflow: auto;
    line-height: .4rem;
    color: #666;
}
.active-note .con span {
    display: block;
    padding: .4rem 0 .1rem;
    font-size: .3rem;
    font-weight: 600;
    line-height: .38rem;
    color: #1e1e1e;
}
.active-note .con em {
    font-weight: 700;
}
.active-note .close {
    position: absolute;
    right: 0;
    bottom: .23rem;
    left: 0;
    width: .67rem;
    margin: auto;
}