body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
margin : 0;
padding : 0 0 0 0;
}
fieldset, img {
border : 0;
}
:focus {
outline : 0;
}
address, caption, cite, code, dfn, em, th, var, optgroup {
font-style : normal;
font-weight : normal;
}
h1, h2, h3, h4, h5, h6 {
font-weight : normal;
font-size : 100%;
}
strong {
font-weight : 700;
}
abbr, acronym {
border : 0;
font-variant : normal;
}
input, button, textarea, select, optgroup, option {
font-family : inherit;
font-size : inherit;
font-style : inherit;
font-weight : inherit;
}
code, kbd, samp, tt {
font-size : 100%;
}
input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner {
border : none;
padding : 0;
}
ol, ul {
list-style : none;
}
table {
border-collapse : collapse;
border-spacing : 0;
}
caption {
text-align : left;
}
sup, sub {
font-size : 100%;
}
:link, :visited, ins {
text-decoration : none;
}
blockquote, q {
quotes : none;
}
blockquote:before, blockquote:after, q:before, q:after {
content : '';
content : none;
}
.clearfix:after, .clearfix:before, .container-fluid:after, .container-fluid:before, .container:after, .container:before, .form-group:after, .form-group:before, .panel:after, .panel:before {
display : table;
content : " ";
}
.clearfix:after, .container-fluid:after, .container:after, .form-group:after, .panel:after {
clear : both;
}
.hidden {
display : none !important ;
}
.show {
display : block !important ;
}
.hide {
display : none;
}
.pull-left, .pull-right {
display : inline;
}
.pull-left {
float : left;
}
.pull-right {
float : right;
}
.pull-right {
float : right;
}
button, input, textarea, select, pre {
font-family : "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
pre {
white-space : normal;
}
*, *:before, *:after {
box-sizing : border-box;
}
.download-windows {
color : #fff;
font-size : 18px;
line-height : 36px;
}
.download-mac {
font-size : 18px;
line-height : 36px;
}
.download-android {
font-size : 18px;
}
.download-ios {
font-size : 18px;
}
html {
height : 100%;
}
body {
font-size : 14px;
line-height : 1.5;
font-family : "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif;
background-color : #212735;
height : 100%;
min-width : 320px;
}
a {
color: #666;
text-decoration: none;
transition : color 0.3s, background-color 0.3s;
}
a:hover {
color : #fff;
text-decoration : none;
}
a.hover-underline:hover {
text-decoration : underline;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-weight : 400;
}
.h1, h1 {
font-size : 24px;
font-weight : 700;
}
.h2, h2 {
font-size : 18px;
font-weight : 700;
}
.h3, h3 {
font-size : 16px;
padding : 0px;
}
.h4, h4 {
font-size : 16px;
padding : 0px;
}
.h5, h5 {
font-size : 14px;
padding : 0px;
}
.h6, h6 {
font-size : 12px;
}
.small, small {
font-size : 85%;
}
.text-light {
color : #999;
}
.text-muted {
color : #777;
}
.text-primary {
color : #ff5c38 !important ;
}
.text-success {
color : #19cf86 !important ;
}
.text-info {
color : #007dfe !important ;
}
.text-warning {
color : #ff9000 !important ;
}
.text-danger {
color : #f76260 !important ;
}
.text-red {
color : #f76260 !important ;
}
.text-green {
color : #19cf86 !important ;
}
.text-blue {
color : #3988ff !important ;
}
.radio, .checkbox {
position : relative;
display : inline-block;
font-size : 14px;
line-height : 20px;
}
.radio input, .checkbox input {
float : left;
margin : 4px 7px 0 0;
}
.radio + .radio, .checkbox + .checkbox {
margin-top : 10px;
}
.radio-inline, .checkbox-inline {
display : inline-block;
vertical-align : middle;
}
.radio-inline + .radio-inline, .checkbox-inline + checkbox-inline {
margin : 0 0 0 15px;
}
input[type="radio"].iradio:enabled, input[type="radio"].iradio:disabled {
opacity : 0;
position : absolute;
}
input[type="radio"].iradio:enabled + .iradio-text, input[type="radio"].iradio:disabled + .iradio-text {
position : relative;
display : inline-block;
min-height : 24px;
line-height : 24px;
padding-left : 36px;
font-size : 16px;
color : #999;
cursor : pointer;
}
input[type="radio"].iradio:disabled + .iradio-text::before, input[type="radio"].iradio:enabled + .iradio-text::before {
content : "";
position : absolute;
top : 50%;
left : 0;
z-index : 2;
width : 24px;
height : 24px;
margin-top : -12px;
overflow : hidden;
border : #666 solid 2px;
border-radius : 50%;
transition : 0.3s;
}
input[type="radio"].iradio:disabled + .iradio-text::after, input[type="radio"].iradio:enabled + .iradio-text::after {
content : "";
position : absolute;
top : 50%;
left : 7px;
z-index : 3;
width : 10px;
height : 10px;
margin-top : -5px;
overflow : hidden;
background-color : #eee;
opacity : 0;
border-radius : 50%;
transition : 0.3s;
}
input[type="radio"].iradio:enabled + .iradio-text:hover {
color : #fff;
}
input[type="radio"].iradio:enabled + .iradio-text:hover::before {
border-color : #fff;
}
input[type="radio"].iradio:enabled + .iradio-text:hover::after {
opacity : 1;
}
input[type="radio"].iradio:enabled:checked + .iradio-text {
color : #ffc758;
}
input[type="radio"].iradio:enabled:checked + .iradio-text::before {
border-color : #ffc758;
}
input[type="radio"].iradio:enabled:checked + .iradio-text::after {
opacity : 1;
background-color : #ffc758;
}
input[type="radio"].iradio:disabled + .iradio-text {
cursor : default;
opacity : 0.4;
}
input[type="radio"].iradio:disabled + .iradio-text::before {
cursor : not-allowed;
}
input[type="radio"].iradio:disabled + .iradio-text::after {
cursor : not-allowed;
}
input[type="radio"].iradio:disabled:checked + .iradio-text {
color : #ffc758;
opacity : 0.3;
}
input[type="radio"].iradio:disabled:checked + .iradio-text::before {
border-color : #ffc758;
opacity : 0.5;
}
input[type="radio"].iradio:disabled:checked + .iradio-text::after {
opacity : 0.6;
background-color : #ffc758;
}
.form-control {
display : inline-block;
width : 100%;
padding : 15px 20px;
vertical-align : middle;
line-height : 20px;
font-size : 16px;
color : #999;
border : none 0;
background-color : #1c202b;
transition : border 0.2s linear, box-shadow 0.2s linear;
border-radius : 10px;
}
.input-lg {
height : 42px;
font-size : 16px;
padding : 10px 13px;
}
.input-sm {
height : 30px;
font-size : 13px;
padding : 4px 8px;
}
.form-control:focus {
color : #fff;
}
.form-control-error {
border-color : #f76260;
}
.form-control-succeed {
border-color : #0cc741;
}
.form-control::-moz-placeholder {
color : #666;
opacity : 1;
}
.form-control:-ms-input-placeholder {
color : #666;
}
.form-control::-webkit-input-placeholder {
color : #666;
}
.form-control[readonly] {
opacity : 0.5;
}
.form-control[disabled], .form-control.disabled {
opacity : 0.5;
cursor : not-allowed;
}
textarea.form-control {
line-height : 1.42857143;
overflow-y : auto;
overflow-x : hidden;
}
select.form-control {
color : #ccc;
}
.btn {
display : inline-block;
padding : 15px 25px;
font-size : 18px;
line-height : 20px;
text-align : center;
white-space : nowrap;
vertical-align : middle;
cursor : pointer;
color : #fff;
border : none 0;
background-color : #f3aa26;
border-radius : 100px;
transition : 0.3s;
}
.btn:hover {
text-decoration : none;
background-color : #f5b91d;
}
.btn:active {
background-color : #f19a2f;
}
.btn.disabled {
cursor : not-allowed;
opacity : 0.5;
box-shadow : none;
}
.btn-block {
display : inline-block;
width : 100%;
}
.btn-square {
border-radius : 3px;
}
button.btn-block, input.btn-block {
width : 100%;
}
.btn-lg {
font-size : 15px;
padding : 13px 50px;
}
.btn-sm {
font-size : 13px;
padding : 4px 15px;
}
.btn-xs {
font-size : 12px;
padding : 1px 13px;
}
.btn-link {
color : #007dfe;
}
.btn-default {
background-color : transparent;
}
.btn-default:hover, .btn-default:active {
background-color : rgb(255, 255, 255, 0.2);
}
.form-group + .form-group {
margin-top : 20px;
}
.form-group {
position : relative;
}
.container {
margin : 0 auto;
max-width : 900px;
padding : 0 20px;
text-align : center;
}
.backdrop {
position : fixed;
top : 0;
right : 0;
bottom : 0;
left : 0;
z-index : 99;
width : 100%;
height : 100%;
backface-visibility : hidden;
background-color : rgb(0, 0, 0, 0.5);
background-color : rgb(28, 32, 43, 0.9);
opacity : 0;
transition : opacity 0.3s;
}
.backdrop.in {
opacity : 1;
}
.matte {
z-index : 1000;
transition : all 0.3s;
opacity : 0;
display : none;
}
.matte.in {
opacity : 1;
display : inline-block;
}
.close {
user-select : none;
appearance : none;
position : absolute;
display : inline-block;
width : 0.3rem;
height : 0.3rem;
overflow : hidden;
border : none 0;
font-size : 0;
background-color : transparent;
border-radius : 50%;
outline : none;
}
.close::before, .close::after {
content : "";
display : inline-block;
position : absolute;
top : 50%;
left : 50%;
background-color : #fff;
transform : translate(-50%,-50%) rotate(45deg);
transform-origin : center center;
}
.close::before {
height : 2px;
width : 50%;
}
.close::after {
height : 50%;
width : 2px;
}
.close:active {
opacity : 0.8;
}
.modal {
display : inline-block;
position : fixed;
top : 50%;
left : 50%;
z-index : -1;
opacity : 0;
background-color : #111520;
border-radius : 10px;
box-shadow : 0 0 20px rgb(0, 0, 0, 0.2);
transition : transform 0.3s, opacity 0.3s;
backface-visibility : hidden;
transform : translate(-50%,-50%) scale(1.2);
}
.modal.in {
opacity : 1;
z-index : 1000;
backface-visibility : visible;
transform : translate(-50%,-50%) scale(1);
}
.modal-close {
position : absolute;
top : -10px;
right : -10px;
z-index : 9;
width : 32px;
height : 32px;
background-color : #f76260;
}
.modal-close::before {
height : 1px;
}
.modal-close::after {
width : 1px;
}
.modal-body {
position : absolute;
top : 86px;
left : 0;
right : 0;
bottom : 0;
overflow-y : auto;
}
.modal-header h2 {
font-size : 20px;
}
.modal-header {
position : relative;
text-align : center;
font-size : 16px;
color : #fff;
padding : 15px 20px;
line-height : 1.428571428571429;
border-radius : 5px 5px 0 0;
background : url(../images/down.png) center bottom no-repeat;
background-size : cover;
}
.actionsheet {
display : inline-block;
position : fixed;
top : 0;
left : 0;
right : 0;
bottom : 0;
width : 100%;
overflow-x : hidden;
overflow-y : auto;
background-color : #212735;
box-shadow : 0 0 45px rgb(0, 0, 0, 0.3);
transition : transform 0.3s, opacity 0.3s;
backface-visibility : hidden;
transform : translate(0,100%);
}
.actionsheet.in {
transform : translate(0,0);
}
.actionsheet-header {
position : relative;
font-size : 12px;
padding : 15px;
color : #999;
text-align : center;
}
.actionsheet-header > .close::before {
height : 2px;
width : 50%;
}
.actionsheet-header > .close::after {
height : 50%;
width : 2px;
}
.actionsheet-header > .close {
top : 5px;
right : 5px;
width : 24px;
height : 24px;
background-color : rgb(255, 255, 255, 0.2);
border-radius : 50%;
}
.actionsheet-header > .close:hover, .actionsheet-header > .close:active {
background-color : #ff0065;
}
.actionsheet-header > .btn-back::after {
display : none;
}
.actionsheet-header > .btn-back {
position : absolute;
top : 50%;
left : 0;
width : 0.5rem;
height : 0.5rem;
padding : 0;
font-size : 0.2rem;
margin-top : -0.25rem;
color : #666;
border-radius : 0;
}
.modal-confirm {
top : 50%;
left : 10%;
right : 10%;
margin : auto;
bottom : auto;
width : auto;
transition : 0.3s;
background-color : #212735;
box-shadow : 0 0 45px rgb(0, 0, 0, 0.3);
transform : scale(1.2) translateY(-50%);
}
.modal-confirm.in {
transform : scale(1) translateY(-50%);
}
.confirm {
text-align : center;
overflow : hidden;
padding-top : 30px;
}
.confirm-icon {
position : relative;
width : 64px;
height : 64px;
margin : auto;
color : #fff;
overflow : hidden;
border-radius : 50%;
background-color : #ffe270;
background : linear-gradient(to bottom, #ffe270 0%, #f2a133 100%);
}
.confirm-icon::before, .confirm-icon::after {
content : '';
position : absolute;
left : 50%;
top : 50%;
}
.confirm-icon::before {
width : 8px;
height : 8px;
background-color : currentColor;
border-radius : 50px;
transform : translate(-50%,150%);
}
.confirm-icon::after {
top : 15px;
width : 6px;
height : 24px;
background-color : currentColor;
border-radius : 2px;
transform : translate(-50%);
}
.confirm-text {
padding-top : 10px;
padding-bottom : 20px;
}
.confirm-action {
font-size : 0;
white-space : nowrap;
border-top : 1px solid rgb(255, 255, 255, 0.1);
}
.confirm-action .btn + .btn {
border-left : 1px solid rgb(255, 255, 255, 0.1);
}
.confirm-action .btn {
border-radius : 0;
width : 50%;
padding : 12px;
font-size : 15px;
background-color : transparent;
}
.confirm-action .btn:active {
background-color : rgb(255, 255, 255, 0.04);
}
.confirm-action .btn-ok {
color : #19cf86;
}
.confirm-action .btn-cancel {
color : #999;
}
.modal-loading {
display : inline-block;
position : fixed;
top : 50%;
left : 50%;
width : 64px;
height : 64px;
margin : -32px 0 0 -32px;
z-index : -1;
opacity : 0;
background-color : rgb(0, 0, 0, 0.75);
border-radius : 10px;
transition : transform 0.3s, opacity 0.3s;
backface-visibility : hidden;
}
.modal-loading.in {
opacity : 1;
z-index : 1000;
backface-visibility : visible;
}
.modal-loading .loader {
margin : 24px;
display : inline-block;
width : 16px;
height : 16px;
}
.weixin-browser {
position : fixed;
top : 0;
left : 0;
right : 0;
bottom : 0;
width : 100%;
height : 100%;
z-index : 999;
overflow : hidden;
background-color : rgb(0, 0, 0, 0.2);
background-size : contain;
display : none;
}
.weixin-browser img {
display : inline-block;
margin : 0 auto;
width : 100%;
}
.weixin-browser .weixin-guide {
margin : 20px 30px;
}
.weixin-browser .weixin-tips {
margin : 30px 10px;
}
.weixin-browser .weixin-tips {
position : absolute;
left : 0;
right : 0;
bottom : 0;
overflow : hidden;
margin : 20px 50px;
}
.weixin-browser .weixin-tips-appdown {
margin-bottom : 0;
bottom : -20px;
}
.weixin-browser .weixin-tips-appdown img {
margin-top : -60px;
}
.header {
position : relative;
z-index : 9;
white-space : nowrap;
font-size : 0;
text-align : center;
background-color : #1c202b;
}
.header > .container {
position : relative;
}
.header > .container > a, .header > .container > h1 {
display : inline-block;
vertical-align : top;
height : 50px;
line-height : 50px;
}
.header > .container > h1 {
margin : 0 50px;
}
.header > .container > h1 > a {
position : relative;
display : inline-block;
width : 120px;
height : 120px;
padding : 20px;
margin-top : -20px;
overflow : hidden;
border-radius : 50%;
background-color : #1c202b;
}
.header > .container > h1 > a > img {
display : inline-block;
width : 80px;
height : 80px;
border-radius : 50%;
}
.header > .container > a {
line-height : 47px;
color : #fff;
font-size : 18px;
font-weight : 700;
padding : 0 30px;
border : #1c202b solid 2px;
border-radius : 100px;
}
.header > .container > a.outline, .header > .container > a.active {
border : #e9943a solid 2px;
}
.header > .container > a:hover {
border-color : #e9943a;
color : #fff;
background-color : #363432;
}
.header .logo {
position : absolute;
top : 0;
left : 20px;
}
.header .logo img {
display : inline-block;
width : 50px;
height : 50px;
}
.header > .container > a.link {
position : absolute;
right : 0;
top : 0;
padding : 0 25px;
}
.header > .container > a.back {
position : absolute;
left : 0;
top : 0;
padding : 0;
width : 50px;
height : 50px;
}
.header > .container > a.back .icon-back {
display : inline-block;
margin : 15px 0 0 19px;
width : 16px;
height : 16px;
border-top : 2px solid;
border-right : 2px solid;
transform : rotate(-135deg);
}
.feedback {
padding-bottom : 30px;
padding-top : 50px;
}
.feedback > h2 {
text-align : center;
font-size : 32px;
margin-bottom : 30px;
}
.feedback-tips {
padding : 15px 25px;
color : #f8b42d;
font-size : 16px;
background-color : #1c202b;
border-radius : 10px;
}
.feedback-item {
margin-top : 30px;
}
.feedback-item > h5 {
font-size : 24px;
}
.feedback-item .radio-group {
font-size : 0;
}
.feedback-item .radio-group .radio {
width : 50%;
display : inline-block;
margin-top : 20px !important ;
}
.feedback-item .textarea {
margin-top : 25px;
}
.feedback-item .textarea input.form-control {
float : left;
width : 65%;
}
.feedback-item .textarea img {
float : right;
max-width : 30%;
border-radius : 10px;
height : 50px;
}
.feedback-modal {
width : 80%;
max-width : 360px;
padding : 40px 30px;
text-align : center;
}
.feedback-modal .feedback-success {
display : inline-block;
margin : auto;
width : 64px;
height : 64px;
border-radius : 50%;
overflow : hidden;
color : #fff;
background-color : #46e6ac;
}
.feedback-modal .feedback-success::before {
content : "";
display : inline-block;
margin : auto;
width : 36px;
height : 18px;
margin-top : 19px;
border-left : 5px solid #fff;
border-bottom : 5px solid #fff;
transform : rotate(-45deg);
}
.feedback-modal h5 {
font-size : 22px;
padding : 10px 0;
}
.feedback-modal .btn {
padding : 10px 50px;
margin-top : 30px;
}
.order-item {
margin : 20px 0;
padding : 0 20px;
background-color : #1c202b;
border-radius : 10px;
}
.order-item > .times span {
position : absolute;
top : 0;
right : 0;
}
.order-item > .times {
position : relative;
height : 45px;
line-height : 45px;
white-space : nowrap;
overflow : hidden;
border-bottom : 1px dashed #212735;
}
.order-item > .primary {
padding : 10px 0;
position : relative;
line-height : 30px;
}
.order-item > .primary h5 {
font-size : 16px;
}
.order-item > .primary p {
font-size : 14px;
color : #999;
}
.order-item > .primary .price {
font-size : 22px;
position : absolute;
top : 10px;
right : 0;
line-height : 60px;
}
.order-nodata {
text-align : center;
padding : 30px;
color : #666;
}
.faq {
background-color : #1c202b;
border-radius : 10px;
margin : 20px 0;
}
.faq-item {
padding : 18px 20px;
line-height : 1.5;
}
.faq-item + .faq-item {
border-top : 1px solid #212735;
}
.faq-item > h5 {
position : relative;
font-size : 14px;
cursor : pointer;
color : #999;
}
.faq-item > p {
padding-top : 7px;
}
.cell + .cell {
border-top : 1px solid #212735;
}
.cell {
position : relative;
padding : 15px;
text-align : left;
color : #999;
text-decoration : none;
display : flex;
align-items : center;
}
.cell:active {
background-color : rgb(54, 62, 80, 0.1);
}
.cell > .cell-hd {
padding-right : 20px;
}
.cell > .cell-hd img {
display : inline-block;
width : 36px;
height : 36px;
}
.cell > .cell-bd {
position : relative;
max-width : 100%;
flex : 1;
}
.cell > .cell-ft {
position : relative;
padding-right : 20px;
}
.cell > .cell-ft::after {
content : " ";
position : absolute;
top : 50%;
right : 8px;
display : inline-block;
height : 10px;
width : 10px;
border-width : 2px 2px 0 0;
border-color : #666;
border-style : solid;
transform : rotate(45deg) translateY(-50%);
}
.cell h5 {
font-size : 18px;
color : #fff;
}
.cell p {
font-size : 14px;
margin-top : 5px;
color : #999;
}
.paydetail {
padding : 15px 0;
text-align : center;
border-radius : 0 0 10px 10px;
background-color : #1c202b;
}
.paydetail h5 {
color : #999;
}
.paydetail .order-price {
color : #fff;
font-size : 32px;
}
.payinfo {
padding : 10px 0;
}
.payinfo .cell {
white-space : nowrap;
padding-top : 5px;
padding-bottom : 5px;
}
.payinfo .cell:active {
background-color : transparent;
}
.payinfo .cell > .cell-ft {
padding-right : 0;
}
.payinfo .cell > .cell-ft::after {
display : none;
}
.iospay {
top : auto;
border-radius : 10px 10px 0 0;
overflow : hidden;
}
.iospay .paylist {
margin : 0 20px 20px 20px;
}
.iospay .payinfo {
padding-bottom : 0;
}
.paylist {
border-radius : 10px;
overflow : hidden;
background-color : #1c202b;
}
.paylist .cell > .cell-hd {
padding-right : 0;
padding-left : 5px;
}
.paylist .cell > .cell-hd img {
width : 30px;
height : 30px;
margin-right : 15px;
}
.paylist h5 {
font-size : 14px;
}
.paylist p {
font-size : 12px;
margin-top : 0;
}
.payaction {
padding-top : 20px;
}
.index-banner {
position : relative;
overflow : hidden;
width : 100%;
text-align : center;
background : url(/public/pc1.gtimg.com/beac8f52c4a19fd9220cca6fcabf3b9b.png) center 0 no-repeat;
}
.index-banner > .banner-img {
position : absolute;
top : 50%;
left : 0;
right : 0;
display : inline-block;
width : 100%;
transform : translateY(-50%);
}
.index-banner > .banner-primary {
position : relative;
width : 100%;
padding : 0 0 0 0;
text-align : center;
}
.index-banner > .banner-primary > .caption {
display : inline-block;
position : relative;
width : 640px;
max-width : 100%;
}
.index-banner > .banner-primary .banner-title {
display : inline-block;
margin : auto;
width : 100%;
height : 100%;
}
.index-banner > .banner-primary .banner-logo {
position : absolute;
left : 10%;
top : 0;
max-width : 50%;
filter : grayscale(100%);
}
.index-banner > .banner-primary .banner-text {
border : blue;
top : 0;
left : 70px;
}
.index-banner > .banner-primary .banner-logo-title {
position : absolute;
left : 16%;
top : 0%;
font-size : 26px;
filter : grayscale(100%);
}
.index-banner .fake {
position : relative;
}
.index-banner .download {
padding-top : 10px;
padding-bottom : 0px;
}
.index-banner .download > a {
position : relative;
display : inline-block;
width : 140px;
height : 50px;
line-height : 50px;
text-align : center;
overflow : hidden;
color : #fff;
font-size : 16px;
white-space : nowrap;
border-radius : 100px;
margin : 1% 1% 1% 1%;
background-color : #f18e2d;
box-shadow : 0 10px 30px 0 rgb(241, 142, 45, 0.3);
}
.index-banner .download > a:hover {
background-color : #f8b62d;
text-decoration : none;
}
.index-banner .download > a > img {
display : inline-block;
vertical-align : -5px;
width : 25px;
height : 25px;
margin-right : 5px;
}
.index-banner .download > a > .windows {
vertical-align : -7px;
}
.index-banner .download > a > .mac {
vertical-align : -7px;
}
.index-banner .download > a > .android {
vertical-align : -7px;
}
.index-banner .download > a > .ios {
vertical-align : -7px;
}
.index-banner .banner-primary-windows {
padding-top : 7%;
}
.index-banner .banner-primary-windows .download {
padding-top : 10px;
}
.index-banner .banner-primary-windows .download > a {
width : auto;
padding : 0 30px;
}
.index-banner .banner-primary-windows .tips {
padding : 30px;
font-size : 16px;
color : #ffe400;
font-weight : 700;
}
.index-banner .banner-primary-windows .tips h2 {
font-size : 24px;
margin-bottom : 7px;
font-weight : 700;
}
.index-banner .banner-primary-mac {
padding-top : 7%;
}
.index-banner .banner-primary-mac .download {
padding-top : 10px;
}
.index-banner .banner-primary-mac .download > a {
width : auto;
padding : 0 30px;
}
.index-banner .banner-primary-mac .tips {
padding : 30px;
font-size : 16px;
color : #ffe400;
font-weight : 700;
}
.index-banner .banner-primary-mac .tips h2 {
font-size : 24px;
margin-bottom : 7px;
font-weight : 700;
}
.index-banner .banner-primary-android {
padding-top : 7%;
}
.index-banner .banner-primary-android .download {
padding-top : 10px;
}
.index-banner .banner-primary-android .download > a {
width : auto;
padding : 0 30px;
}
.index-banner .banner-primary-android .tips {
padding : 30px;
font-size : 16px;
color : #ffe400;
font-weight : 700;
}
.index-banner .banner-primary-android .tips h2 {
font-size : 24px;
margin-bottom : 7px;
font-weight : 700;
}
.index-banner .banner-primary-ios {
padding-top : 7%;
}
.index-banner .banner-primary-ios .download {
padding-top : 10px;
}
.index-banner .banner-primary-ios .download > a {
width : auto;
padding : 0 30px;
}
.index-banner .banner-primary-ios .tips {
padding : 30px;
font-size : 16px;
color : #ffe400;
font-weight : 700;
}
.index-banner .banner-primary-ios .tips h2 {
font-size : 24px;
margin-bottom : 7px;
font-weight : 700;
}
.ico-img img {
height : 32px;
width : 32px;
}
.banner-brand img {
margin : 5px 5px 5px 5px;
width : 72px;
height : 72px;
}
.banner-brand {
position : relative;
z-index : 5;
text-align : center;
padding : 5px;
font-size : 0;
background-color : rgb(255, 255, 255, 0.04);
border-radius : 10px;
margin : 10px 25px 10px;
}
.cooperation {
position : relative;
overflow : hidden;
background : url(/public/pc1.gtimg.com/3d92335c616d0d7604a166a91c8ef0a6.png) center 0 no-repeat;
background-size : cover;
}
.cooperation .cooperation-bottom {
position : absolute;
left : 50%;
bottom : -30%;
max-width : 80%;
transform : translateX(-50%);
}
.cooperation .cooperation-title {
display : inline-block;
margin : auto;
margin-top : 30px;
width : 80%;
}
.cooperation ul {
display : inline-block;
position : relative;
z-index : 10;
margin : 90px 0 90px 0;
text-align : center;
}
.cooperation li {
padding : 0px 50px 0px 50px;
float : left;
font-size : 18px;
}
.cooperation img {
display : inline-block;
margin : auto;
margin-bottom : 40px;
}
.footer {
padding : 0;
text-align : center;
line-height : 30px;
color : #acafb8;
}
.footer a {
font-size : 12px;
color : #acafb8;
}
.iosdown {
position : relative;
overflow : hidden;
text-align : center;
padding : 50px 0 70px 0;
}
.iosdown::before, .iosdown::after {
content : "";
width : 600px;
height : 600px;
position : absolute;
z-index : 1;
bottom : 0;
left : 50%;
border-radius : 50%;
background-color : rgb(255, 255, 255, 0.04);
box-shadow : 0 0 35px rgb(0, 0, 0, 0.1);
transform : translateX(-50%);
}
.iosdown::before {
z-index : 2;
width : 320px;
height : 320px;
bottom : 140px;
}
.iosdown h2 {
font-size : 36px;
position : relative;
z-index : 5;
padding-top : 10px;
}
.iosdown h3 {
font-size : 24px;
margin-top : 20px;
position : relative;
z-index : 5;
}
.iosdown-step {
margin-top : -40px;
position : relative;
overflow : hidden;
text-align : center;
padding : 70px 0 6% 0;
}
.iosdown-step::before, .iosdown-step::after {
content : "";
width : 1000px;
height : 1000px;
position : absolute;
z-index : 1;
top : 0;
left : 50%;
border-radius : 50%;
background-color : rgb(255, 255, 255, 0.02);
box-shadow : 0 0 35px rgb(0, 0, 0, 0.1);
transform : translateX(-50%);
}
.iosdown-step::before {
z-index : 2;
width : 600px;
height : 600px;
top : 200px;
}
.iosdown-step > h5 {
color : #ffe400;
font-size : 32px;
}
.iosdown-step > .iosdown-item {
position : relative;
z-index : 5;
display : inline-block;
margin : auto;
max-width : 500px;
margin-top : 50px;
padding : 30px 50px;
font-size : 18px;
background-color : rgb(255, 255, 255, 0.075);
border-radius : 10px;
}
.iosdown-step > .iosdown-item .btn {
display : inline-block;
font-size : 22px;
margin-top : 15px;
}
.iosdown-step > .iosdown-item .btn img {
height : 32px;
border-radius : 10px;
margin-right : 5px;
vertical-align : -9px;
}
.iosdown-step > .iosdown-item .num {
position : absolute;
top : -24px;
left : 50%;
margin-left : -24px;
color : #000;
width : 48px;
height : 48px;
line-height : 48px;
overflow : hidden;
font-size : 24px;
font-weight : 700;
text-align : center;
border-radius : 50%;
background-color : #ffe400;
}
.app {
max-width : 768px;
margin : auto;
background-color : #212735;
}
.app-header {
position : relative;
text-align : center;
color : #fff;
height : 46px;
line-height : 46px;
overflow : hidden;
background-color : #1c202b;
}
.app-header h2 {
font-size : 18px;
}
.app-header .app-back {
color : rgb(255, 255, 255, 0.75);
position : absolute;
left : 0;
top : 0;
width : 46px;
height : 46px;
overflow : hidden;
}
.app-header .app-back:active {
opacity : 0.8;
}
.app-header .app-back .icon-back {
display : inline-block;
margin : 17px 0 0 19px;
width : 12px;
height : 12px;
border-top : 2px solid;
border-right : 2px solid;
transform : rotate(-135deg);
}
.app-header .app-link {
position : absolute;
top : 0;
right : 0;
padding : 0 15px;
color : rgb(255, 255, 255, 0.75);
}
.sign-form {
padding : 35px;
}
.sign-form h3 {
padding : 30px 0;
}
.sign-form h3 img {
display : inline-block;
margin : auto;
width : 60px;
height : 60px;
border-radius : 50%;
}
.sign-form .sign-tips {
color : #ffe400;
}
.sign-tabs {
margin : 20px 0;
font-size : 0;
white-space : nowrap;
border : rgb(255, 255, 255, 0.15) solid 1px;
border-radius : 100px;
}
.sign-tabs > a {
display : inline-block;
width : 50%;
line-height : 20px;
padding : 10px;
font-size : 15px;
color : rgb(255, 255, 255, 0.4);
text-align : center;
border-radius : 100px;
}
.sign-tabs > a.active {
background-color : #1c202b;
color : #fff;
}
.sign-form .btn {
font-size : 16px;
padding : 12px;
}
.sign-form .form-control {
font-size : 15px;
padding : 13px 20px;
border-radius : 100px;
}
.sign-form .control-label {
position : absolute;
}
.sign-form .control-addon {
position : absolute;
right : 20px;
top : 0;
line-height : 46px;
z-index : 5;
color : #0bb6ee;
}
.sign-form .control-addon:active {
color : #ffe400;
}
.iosbuy {
padding-top : 30px;
}
.iosbuy-item + .iosbuy-item {
margin-top : 20px;
}
.iosbuy-item > h4 {
font-size : 22px;
}
.iosbuy-group {
margin : 10px 0;
}
.iosbuy-group > li {
padding : 10px 0;
}
.iosbuy-group > li > .iosbuy-toggle {
padding : 20px;
cursor : pointer;
background-color : rgb(255, 255, 255, 0.05);
border-radius : 6px;
}
.iosbuy-group > li > .iosbuy-toggle:hover, .iosbuy-group > li > .iosbuy-toggle:active {
background-color : rgb(255, 255, 255, 0.1);
}
.iosbuy-group .cell-hd {
font-size : 36px;
color : #fff;
padding : 0 10px;
}
.iosbuy-group .cell-bd {
padding : 0 20px;
}
.iosbuy-group .cell-bd .text-orange {
font-size : 24px;
color : #ffe400;
}
.iosbuy-group .cell-bd .text-orange strong {
font-size : 36px;
}
.iosbuy-group .cell-bd del {
font-size : 16px;
color : rgb(255, 255, 255, 0.5);
padding-left : 16px;
}
.iosbuy-group .reduced {
display : inline-block;
min-width : 150px;
padding : 8px 30px;
font-size : 16px;
color : rgb(255, 255, 255, 0.5);
text-align : center;
background-color : rgb(255, 255, 255, 0.1);
border-radius : 100px;
}
.iosbuy-group-diamond .reduced {
background-color : #fae5ff;
}
.iosbuy-group-diamond > li > .iosbuy-toggle:hover, .iosbuy-group-diamond > li > .iosbuy-toggle:active {
border-color : #ce0bff;
background-color : #fae5ff;
}
.iosbuy-group-diamond > li > .iosbuy-toggle:hover .reduced {
background-color : #ce0bff;
}
.iosbuy-tips {
margin-top : 20px;
padding : 10px 15px;
overflow : hidden;
line-height : 1.3;
color : #ffe400;
border : rgb(255, 255, 255, 0.1) dashed 1px;
border-radius : 6px;
}
@media (min-width: 768px) {
.h1, h1 {
font-size : 20px;
font-weight : 700;
}
.h2, h2 {
font-size : 18px;
font-weight : 700;
}
.h3, h3 {
font-size : 16px;
}
.h4, h4 {
font-size : 16px;
}
.h5, h5 {
font-size : 14px;
}
.actionsheet {
max-width : 480px;
left : 50%;
top : 50%;
right : auto;
bottom : auto;
transform : translate(-50%,100%);
border-radius : 10px;
}
.actionsheet.in {
transform : translate(-50%,-50%);
}
.modal-confirm {
width : 480px;
left : 50%;
top : 50%;
right : auto;
bottom : auto;
transform : scale(1.2) translate(-50%,-50%);
}
.modal-confirm.in {
transform : scale(1) translate(-50%,-50%);
}
}
@media (max-width: 4096px) {
.ico-img {
padding-top: 30px;
padding-bottom: 0px;
}
}
@media (max-width: 1023px) {
.index-banner > .banner-primary .banner-title {
display : inline-block;
margin : auto;
width : 70%;
height : 70%;
}
@media (max-width: 767px) {
.h1, h1 {
font-size : 20px;
font-weight : 700;
}
.h2, h2 {
font-size : 14px;
font-weight : 700;
}
.index-banner > .banner-primary .banner-title {
display : inline-block;
margin : auto;
width : 40%;
height : 40%;
}
.ico-img {
padding-top: 5px;
padding-bottom: 0px;
}
.ico-img img {
height : 18px;
width : 18px;
}
}
@media (max-height: 480px) and (max-width: 767px) {
.h1, h1 {
font-size : 20px;
font-weight : 700;
}
.h2, h2 {
font-size : 16px;
font-weight : 700;
}
.ico-img {
padding-top: 5px;
padding-bottom: 0px;
}
.ico-img img {
height : 16px;
width : 16px;
}
.index-banner .download {
padding-top : 5px;
padding-bottom : 0px;
}
.index-banner > .banner-primary .banner-title {
display : inline-block;
margin : auto;
width : 50%;
height : 50%;
}
}
@media screen and (max-width: 480px) {
}
@media screen and (max-width: 320px) {
.banner-brand img {
margin : 5px 5px 5px 5px;
width : 32px;
height : 32px;
}
.index-banner > .banner-primary-windows .download > a span {
display : none;
}
.index-banner > .banner-primary-mac .download > a span {
display : none;
}
.index-banner > .banner-primary-android .download > a span {
display : none;
}
.index-banner > .banner-primary-ios .download > a span {
display : none;
}
}