@charset "utf-8";

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;}
fieldset, img {border: 0;}
img {vertical-align: middle;}
: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,b{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;}
input[type="number"] { -moz-appearance: textfield; }
input::-webkit-clear-button,
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { -webkit-appearance: none; appearance: none; display: none； }
input::-webkit-input-placeholder{color:#ddd;}
input:focus::-webkit-input-placeholder{color:#f5f5f5;}
textarea::-webkit-input-placeholder{color:#ddd;}
textarea:focus::-webkit-input-placeholder{color:#f5f5f5;}
a,button,input,textarea{-webkit-tap-highlight-color: rgba(0,0,0,0;);-webkits-user-modify:read-write-plaintext-only;}
a{ -webkit-touch-callout: none; }
a, img {-webkit-touch-callout:none; }
ol, ul {list-style: none;}
table {border-collapse: collapse;border-spacing: 0;}
caption, th {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,.form-group:after,.form-group:before,.row:after,.row:before{display:table;content:" ";}
.clearfix:after,.form-group:after,.row:after{clear:both;}
.hide{ display:none; }
.hidden{display:none !important;}
.show{display: block !important;}
.fl{float:left;}
.fr{float:right;}
*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
}
html{ font-size: 100px;}
@media (max-device-width:321px){html{font-size: 85.7142857px;}}
@media screen and (min-width:415px) and (max-width:639px){html{font-size:120px;}}
@media screen and (min-width:640px) and (max-width:719px){html{font-size:150px;}}
@media screen and (min-width:720px) and (max-width:799px){html{font-size:200px;}}
@media screen and (min-width:800px){html{font-size:225px}}
html, body{
    width: 100%;
    height: 100%;
    scroll-behavior:smooth;
	-webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-text-size-adjust: none;
    -webkit-user-select: none;
            user-select: none;
}
body {
	color: #fff;
	font-size: .14rem;
	line-height: 1.428571428571429;
	font-family: -apple-system-font,Helvetica,STHeiti STXihei, Microsoft JhengHei, Microsoft YaHei, Arial;
    background-color: #1b4880;
    -webkit-overflow-scrolling: touch; 
            overflow-scrolling: touch;
}
a{ text-decoration: none; color: rgba(255,255,255,.6); }
a:hover,a:active{ color: #fff; text-decoration: none; }
a:focus { outline: 0 none;}

/* Hx */
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{ font-weight: 400; margin: 0; }
.h1,h1{ font-size: .32rem; }
.h2,h2{ font-size: .24rem; }
.h3,h3{ font-size: .18rem; }
.h4,h4{ font-size: .16rem; }
.h5,h5{ font-size: .14rem; }
.h6,h6{ font-size: .12rem; }
.small,small{ font-size: 90%; }

/* blur */
.blur{ filter: blur(3px); -webkit-filter: blur(3px); }
.fixed{ position: fixed; z-index: 10; top: 0; left: 0; right: 0; }

.btn{
	position: relative;
	display: block;
	line-height: .2rem;
	padding: .12rem;
	font-size: .16rem;
	text-align: center;
	color: #fff;
	cursor: pointer;
	background-color: transparent;
	border-radius: 1rem;    
}
	button.btn,input.btn{
		width: 100%;
		border: 0 none;
		outline: 0;
		-webkit-appearance: none;
				appearance: none;
	}
	button.btn:focus,input.btn:focus{ outline: 0; }
	button.btn-inline,input.btn-inline{ width: auto; }
    .btn:active{ opacity: .85; box-shadow: none!important;}
	.btn + .btn{ margin-top: .15rem; }
    
	
	.btn-android:not(.btn-disabled):active{ background: #0085fe; }
	.btn-android{
		background-color: #00aaff;
		background: -webkit-linear-gradient(to right, #00aaff 0%, #0085fe 100%);
		background: linear-gradient(to right,  #00aaff 0%, #0085fe 100%);
        box-shadow: 0 .03rem .15rem rgba(0,133,254,.3);
	}
	.btn-ios:not(.btn-disabled):active{ background: #20d071; }
	.btn-ios{ 
        background-color: #42ec6e;
		background: -webkit-linear-gradient(to right, #42ec6e 0%, #20d071 100%);
		background: linear-gradient(to right,  #42ec6e 0%, #20d071 100%);
        box-shadow: 0 .03rem .15rem rgba(32,208,113,.3);
    }
    .btn-url:not(.btn-disabled):active{ background: #fb922f; }
    .btn-url{ 
        background-color: #fbba2f;
        background: -webkit-linear-gradient(to right, #fbba2f 0%, #fb922f 100%);
        background: linear-gradient(to right, #fbba2f 0%, #fb922f 100%);
        box-shadow: 0 .03rem .15rem rgba(251,146,47,.3);
    }



/* header */
.header{
    height: 1rem;
    text-align: center;
    background: url(../images/bg.png) center bottom no-repeat;
    background-size: cover;
}
    /* h1 */
    .header h1 a{ display: block; }
    .header h1 img{ display: block; margin: auto; height: .6rem; padding: .15rem 0; }

    /* tabs */
    .header .tabs.fixed{ 
        background-color: rgba(9,84,176,.98); 
        background: url(../images/bg.png) center bottom no-repeat;
        background-size: cover;
    }
    .header .tabs{ 
        height: .4rem;
        overflow: hidden; 
        font-size: 0; 
        white-space: nowrap; 
        background-color: rgba(9,84,176,.2); 
        transition: .3s;
    }
        .header .tabs > a{ 
            position: relative;
            display: inline-block; 
            width: 50%;
            line-height: .2rem;
            padding: .1rem;
            font-size: .16rem;
            color: #fff;
            transition: .3s;
        }
        .header .tabs > a + a::before{ 
            content: "";
            position: absolute;
            left: 0;
            top: 50%;
            width: 1px;
            height: .14rem;
            overflow: hidden;
            margin-top: -.07rem;
            background-color: rgba(255,255,255,.1);
        }
        .header .tabs > a::after{ 
            content: "";
            position: absolute;
            left: 50%;
            bottom: -6px;
            border-bottom: 6px dashed #1b4880;
            border-right: 6px solid transparent;
            border-left: 6px solid transparent;
            transition: .3s;
            -webkit-transform: translateX(-50%);
                    transform: translateX(-50%);
        }
        .header .tabs > a.active{ font-weight: 700; }
        .header .tabs > a.active::after{ bottom: 0; }


/* urlgroup */
.urlgroup{ width: 100%; overflow: hidden; }
.urlgroup > li{ position: relative; float: left; width: 25%; overflow: hidden; }
.urlgroup > li > a{ display: block; text-align: center; padding: .15rem .05rem; font-size: .12rem; border-radius: .05rem; }
.urlgroup > li > a:hover,
.urlgroup > li > a:active{ background-color: rgba(0,0,0,.05); }
.urlgroup > li > a > img{ display: block; margin: auto; width: .48rem; height: .48rem; margin-bottom: .05rem; }
.urlgroup > li > a > .title{ display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color:#fff}
.urlgroup > li > .urltype{ display: none; }

/* close */
.close{
	-webkit-user-select: none;
			user-select: none;
	-webkit-appearance: none;
			appearance: none;
	position: absolute;
	display: block;
	width: .3rem;
	height: .3rem;
	overflow: hidden;
	border: 0 none;
    font-size: 0;
	background-color: transparent;
	border-radius: 50%;
	outline: none;
}
	.close::before,
	.close::after {
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		background-color: rgba(255,255,255,.5);
		-webkit-transform: translate(-50%,-50%) rotate(45deg);
				transform: translate(-50%,-50%) rotate(45deg);
		-webkit-transform-origin: center center;
				transform-origin: center center;
	}
	.close::before{ height: 2px; width: 50%; }
	.close::after { height: 50%; width: 2px; }
	.close:active { opacity: .8; }

/* backdrop */
.backdrop{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
	z-index: 99;
    width: 100%;
    height: 100%;
    pointer-events: none;
    backface-visibility: hidden;
    background-color: rgba(0,0,0,.5);
    opacity: 0;
    transition: opacity .3s;
}
    .backdrop.in{ opacity: 1; pointer-events: auto; }

/* modal */
.modal{
    display: block;
    position: fixed;
	top: 50%;
	left: 10%;
	right: 10%;
    z-index: 1000;
    overflow: hidden;
	opacity: 0;
    pointer-events: none;
    background-color: #1b4880;
    border-radius: .1rem;
    transition: all .3s;
    box-shadow: 0 0 .1rem rgba(0,0,0, .08);
    transition: transform .3s, opacity .3s;
	-webkit-backface-visibility: hidden;
    		backface-visibility: hidden;
    -webkit-transform: translateY(-50%) scale(1.2);
        	transform: translateY(-50%) scale(1.2);
}
    .modal.in{
        pointer-events: auto;
		opacity: 1;
        -webkit-backface-visibility: visible;
    		    backface-visibility: visible;
		-webkit-transform: translateY(-50%) scale(1);
        		transform: translateY(-50%) scale(1);
    }
	.modal-close{
		position: absolute;
		top: 50%;
		right: .12rem;
		z-index: 9;
		width: .24rem;
		height: .24rem;
        background-color: rgba(0,0,0,.2);
        border-radius: 50%;
        -webkit-transform: translateY(-50%);
        		transform: translateY(-50%);
	}
	.modal-close::before{ height: .02rem; }
	.modal-close::after { width: .02rem; }
	.modal-body{ padding: .25rem;}
    .modal-title{ font-size: .18rem; }
	.modal-header{
		position: relative;
		text-align: center;
		font-size: .14rem;
		color: #fff;
		padding: .15rem .2rem;
		line-height: .2rem;
	}
		.modal-header::after{
			content: " ";
			position: absolute;
			left: 0;
			bottom: 0;
			right: 0;
			height: 1px;
			color: rgba(255,255,255,.1);
			border-bottom: 1px solid rgba(255,255,255,.1);
			-webkit-transform-origin: 0 100%;
					transform-origin: 0 100%;
			-webkit-transform: scaleY(0.5);
					transform: scaleY(0.5);
		}
		
/* modal-url */
.modal-url .btn::before{
    content: "";
    display: inline-block;
    vertical-align: -.03rem;
    width: .2rem;
    height: .2rem;
    margin-right: .05rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: .2rem .2rem;
}
    .modal-url .btn-android::before{ background-image: url(../images/andriod.png); }
    .modal-url .btn-ios::before    { background-image: url(../images/ios.png); }
    .modal-url .btn-url::before    { background-image: url(../images/link.png); }

/* modal-downapp */
.modal-downapp{border: 2px solid rgba(255,255,255,.75);  }
.modal-downapp .modal-header{ text-align: left;  padding: .12rem .15rem; background-color: #dd282d; }
.modal-downapp .modal-title{ font-size: .14rem; font-weight: 700; }
.modal-downapp .text{ overflow: hidden; padding-bottom: .2rem; }
.modal-downapp .text p{ overflow: hidden; padding: .03rem 0 0 .1rem; }
.modal-downapp .text p strong{ font-size: .18rem; }
.modal-downapp .text img{ float: left; width: .48rem; height: .48rem; }
.modal-downapp .btn-group{ padding-left: .4rem; padding-right: .4rem; }