@charset "utf-8";
@import "../fonts/iconfont/iconfont.css";
@import "../fonts/DFPKingGothicGB/dfpk.css";
@font-face { font-family: Lato; font-weight: 400; src: url(../fonts/lato/Lato-Regular.woff2?v=6748e0e1) format("woff2"), url(../fonts/lato/Lato-Regular.woff?v=f137ee48) format("woff"); }
@font-face { font-family: Lato; font-style: italic; src: url(../fonts/lato/Lato-Italic.woff2?v=f8a9a7a9) format("woff2"), url(../fonts/lato/Lato-Italic.woff?v=a8fc7661) format("woff"); }
@font-face { font-family: Lato; font-weight: 700; src: url(../fonts/lato/Lato-Bold.woff2?v=649e18eb) format("woff2"), url(../fonts/lato/Lato-Bold.woff?v=fd373951) format("woff"); }
@font-face { font-family: DIN; src: url(../fonts/DIN/DIN-Alternate-Bold.ttf); unicode-range: U+30-39, U+0041-007a; font-display: fallback; }
*,
*:after,
*:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
* { margin: 0; padding: 0; outline: none; }
ol,
ul { list-style: none; }
ins,
a { text-decoration: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; }
table { border-collapse: collapse; border-spacing: 0; }
img { border: none; vertical-align: middle; }
html { font-size: 62.5%; }
body { background-color: var(--color-main-bg); color: var(--color-main-txt); font-size: 1.4rem; font-family: PingFang SC, DFPKingGothicGB-Regular, Lato, Tahoma, Microsoft Yahei, sans-serif; }
body.noscrolling { overflow: hidden; }
body::-webkit-scrollbar { display: none; }
a { text-decoration: none; color: var(--color-main-txt); }
a,
span { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); tap-highlight-color: rgba(0, 0, 0, 0); }
select { -webkit-appearance: none; appearance: none; border: none; background: transparent; text-align: center; }
input,
select,
textarea { outline: none; background-color: transparent; color: var(--color-white); -webkit-appearance: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-size: 1.4rem; font-family: PingFang SC, DFPKingGothicGB-Regular, Lato, Tahoma, Microsoft Yahei, sans-serif; }
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px var(--color-white) inset; }
.page { width: 100%; height: 100%; max-width: 42.8rem; margin: 0 auto; }
.w-l-b { padding: 2rem 1rem; }
.w-l-b .w-a { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.w-l-b .w-a img { height: 3rem; width: auto; }
.w-l-b .w-a a { background-color: rgba(255, 255, 255, 0.1); color: var(--color-white); padding: 1rem; border-radius: 10rem; -webkit-border-radius: 10rem; -moz-border-radius: 10rem; font-size: 1.3rem; }
.w-l-b .w-a a i { margin-right: 0.2rem; }
.w-l-b .w-b dl { margin: 2rem 0; }
.w-l-b .w-b dl dt { color: var(--color-light); padding: 0.5rem 0; }
.w-l-b .w-b dl dt i { font-size: 2rem; margin-right: 0.3rem; vertical-align: middle; position: relative; bottom: 0.2rem; }
.w-l-b .w-b dl dd { background-color: rgba(255, 255, 255, 0.1); border-bottom: 0.1rem solid rgba(255, 255, 255, 0.05); padding: 1.5rem 1rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.w-l-b .w-b dl dd:nth-of-type(1) { border-radius: 1rem 1rem 0 0; -webkit-border-radius: 1rem 1rem 0 0; -moz-border-radius: 1rem 1rem 0 0; }
.w-l-b .w-b dl dd:last-child { border-radius: 0 0 1rem 1rem; -webkit-border-radius: 0 0 1rem 1rem; -moz-border-radius: 0 0 1rem 1rem; }
.w-l-b .w-b dl dd .d-l { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
.w-l-b .w-b dl dd .d-l .l-l span { display: inline-block; width: 3rem; height: 3rem; line-height: 3rem; border-radius: 3rem; -webkit-border-radius: 3rem; -moz-border-radius: 3rem; text-align: center; margin-right: 0.5rem; }
.w-l-b .w-b dl dd .d-l .l-l span.s-io { color: #fff; }
.w-l-b .w-b dl dd .d-l .l-l span.s-an { color: #a2bb3e; }
.w-l-b .w-b dl dd .d-l .l-l span i { font-size: 3rem; }
.w-l-b .w-b dl dd .d-l .l-r h3 { font-size: 1.5rem; font-weight: 500; font-family: PingFang SC, DFPKingGothicGB-Medium, Lato, Tahoma, Microsoft Yahei, sans-serif; }
.w-l-b .w-b dl dd .d-l .l-r b { font-weight: 500; font-size: 1.2rem; display: inline-block; width: 3.6rem; height: 1.8rem; line-height: 1.8rem; text-align: center; color: var(--color-white); border-radius: 0.2rem; -webkit-border-radius: 0.2rem; -moz-border-radius: 0.2rem; margin-left: 0.5rem; vertical-align: middle; position: relative; bottom: 0.1rem; }
.w-l-b .w-b dl dd .d-l .l-r b.b-k1 { filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr="#FE7A40", endColorstr="#F53B3B"); background: -webkit-linear-gradient(270deg, #FE7A40, #F53B3B); background: -moz-linear-gradient(270deg, #FE7A40, #F53B3B); background: -o-linear-gradient(270deg, #FE7A40, #F53B3B); background: linear-gradient(270deg, #FE7A40, #F53B3B); }
.w-l-b .w-b dl dd .d-l .l-r b.b-k2 { filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr="#40b4fe", endColorstr="#3b63f5"); background: -webkit-linear-gradient(270deg, #40b4fe, #3b63f5); background: -moz-linear-gradient(270deg, #40b4fe, #3b63f5); background: -o-linear-gradient(270deg, #40b4fe, #3b63f5); background: linear-gradient(270deg, #40b4fe, #3b63f5); }
.w-l-b .w-b dl dd .d-l .l-r span { color: var(--color-light); margin-top: 0.3rem; display: inline-block; font-size: 1.2rem; }
.w-l-b .w-b dl dd .d-r a { display: inline-block; width: 8rem; height: 3.2rem; line-height: 3.2rem; background-color: rgba(255, 255, 255, 0.1); color: var(--color-white); text-align: center; font-size: 1.3rem; border-radius: 0.4rem; -webkit-border-radius: 0.4rem; -moz-border-radius: 0.4rem; cursor: pointer; }
.w-l-b .w-b dl dd .d-r a i { font-size: 2.2rem; }
.w-l-b .w-b dl dd .d-w { text-align: center; width: 100%; border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; }
.w-l-b .w-b dl dd .d-w h2 { font-size: 1.6rem; padding: 1rem 0; color: var(--color-primary); }
.w-l-b .w-b dl dd .d-w h2 span { color: var(--color-white); font-size: 1.2rem; background-color: rgba(255, 255, 255, 0.1); padding: 0.5rem 1rem; border-radius: 0.4rem; -webkit-border-radius: 0.4rem; -moz-border-radius: 0.4rem; }
.w-l-b .w-b dl dd .d-w img { width: 12rem; height: 12rem; margin: 0 auto; margin-bottom: 1rem; }
#forever_domain { display: inline-block; padding: .1rem .5rem;  border-radius: .2rem; color: #fff; font-size: 1.6rem; filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr="#FE7A40", endColorstr="#F53B3B"); background: -webkit-linear-gradient(270deg, #FE7A40, #F53B3B); background: -moz-linear-gradient(270deg, #FE7A40, #F53B3B); background: -o-linear-gradient(270deg, #FE7A40, #F53B3B); background: linear-gradient(270deg, #FE7A40, #F53B3B); }
#qr_code {
    padding: 15px;
    background: #fff;
    border-radius: 8px;
    display: inline-block;
    margin: 10px 0;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

#qr_code img,
#qr_code canvas {
    display: block;
    width: 160px;
    height: 160px;
}

:root { --color-main-bg: #000; --color-main-txt: #e1e3e5; --color-white: #fff; --color-black: #000; --color-dark: #333; --color-border: #e2e2e2; --color-666: #666; --color-light: #969699; --color-primary: #f96518; --color-primary-rgba: 249,101,24; }
.security-box{
    background:#fff;
    width:100%; max-width:428px; margin:0 auto;
}