@charset "utf-8";
/* CSS Document */
* { padding: 0px; margin: 0px; font-family: "microsoft yahei", "Arial"; font-size: 14px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0)!important; outline: none!important; text-decoration:none;  }
img { border: 0px; margin: 0px; vertical-align: middle; }
html, body { color: #333; background: #FFF; }
body { min-width: 1200px;}
i, span, em { font-style: normal; }
a{ color: #333; text-decoration: none; }
a:hover { color:#333;text-decoration: none;}
a, button, input { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
ul, li { list-style-type: none; margin: 0px; padding: 0px; }
h3 { font-size: 18px; }
h4 { font-size: 16px; }
.tl { text-align: left; }
.tr { text-align: right; }
.tc { text-align: center;}
.fl { float: left;}
.fr { float: right;}
.mt10 {margin-top: 10px!important; }
.mt20 { margin-top: 20px!important;}
.mt30 { margin-top: 30px!important;}
.mt40 { margin-top: 40px!important;}
.mt50 { margin-top: 50px!important;}
.pd10 { padding: 10px;}
.pd20 { padding: 20px;}
.pd30 { padding: 30px;}
.pd40 { padding: 40px;}
.pd50 { padding: 50px;}
.w { width: 100%; clear: both; overflow: hidden; }
.m,.wm{ clear: both; overflow: hidden; width: 1200px; margin: 0px auto;}
.cl { clear: both;}
.hide { display:none;}
.wm { width: 1240px; }
.red { color: #ff0000;}
.bxsg,input,textarea { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.nobor { border: none!important; }
.shadow { -moz-box-shadow: 0px 0px 10px #888 ; -webkit-box-shadow: 0px 0px 10px #888; box-shadow: 0px 0px 10px #888; }
.header { background: #024899;transition: all 150ms linear 0s; overflow: visible;height: 120px;}
.header>div>a { float: left; display: block; width: 305px; line-height: 120px;}
.header>div>a>img { width: 100%;}
.header>div>i { display: none;}
.header>div>p { height: 40px; text-align: right; color: #FFF; line-height: 40px;}
.header>div>p>a { color: #FFF;}
.header>div>p>a>i { margin-right: 10px;}
.header>div>p>i {padding: 0px 10px; }
.header>div>span { display: none;}
.header>div>ul { text-align: right; line-height: 80px; color: #FFF; }
.header>div>ul>li { display: inline-block;padding: 0px 17px;transition: all 150ms linear 0s; position: relative;}
.header>div>ul>li>a { color: #FFF; font-size: 16px; }
.header>div>ul>li::after{ content: ""; height: 6px; background:#024899; left: 50%; margin-left: -1px; width: 0px;  position: absolute;transition: all 200ms linear 0s; bottom: 0px; border-radius: 3px; }
.header>div>ul>li:hover::after,.header>div>ul>li.active::after{ background: #FFF; bottom: 3px; left: 0px; width: 100%;}
.header>div>ul>li>a:hover,.header>div>ul>li>ul>li>a:hover { }
.header>div>ul>li.search-btn { padding: 0px 5px 0px 15px; cursor: pointer; }
.header>div>ul>li.search-btn>i { font-size: 20px;}
.header>div>ul>li.search-btn::after{ display: none;}
.header,.header>.m { overflow: visible;}

.header>div>div { display: none; height: 40px;position: relative; text-align:right; line-height: 40px; margin-top: 15px;}
.header>div>div>i { color: #FFF;font-size: 32px; margin-left: 10px; cursor: pointer; vertical-align: middle;}
.header>div>div>input { background: #FFF;width: 550px; border: none; height: 40px; padding: 0px 20px; border-radius: 20px;}
.header>div>div>label { position: absolute; right: 55px; top: 0px; color: #024899; font-size: 24px; cursor: pointer;}

.header>div>ul>li>ul { display:none; position:absolute; left: -20px; right: -20px; top: 78px;  line-height: 40px;z-index: 2; background: #024899; border-radius: 0px 0px 5px 5px;}
.header>div>ul>li:hover>ul { display: block;}
.header>div>ul>li>ul>li { text-align: center;}
.header>div>ul>li>ul>li:hover { background: #252b5c;}
.header>div>ul>li>ul>li:last-child { border-radius: 0px 0px 5px 5px;}
.header>div>ul>li>ul>li>a { color: #FFF; }


.mtit {font-size: 24px; text-align: center; font-weight: bold; padding: 50px 0px;}
.mtit>p { font-size: 16px; color: #024899; font-weight: unset; line-height: 35px;letter-spacing:2px;text-transform: uppercase }

.footer { padding: 30px 0px;  background: #024899; color: #FFF; }
.footer div.info { text-align: left; float: left; line-height: 30px;}
.footer div.qrcode { text-align: right; float: right;}
.footer div.qrcode img { width: 100px; display: block;}
.footer div.qrcode>p { width: 100px; line-height: 25px; float: right; margin-left: 20px; text-align: center;}
.footer a { color: #FFF;}
.footer a:hover { color: #FFF;}

.mymask { position: fixed; left: 0px; top: 0px; right: 0px; bottom: 0px; background: rgba(0,0,0,0.5); z-index: 8; transition: all 0.2s linear 0.1s; display: none;}
body.show-mask { overflow: hidden; height: 100%;}
body.show-mask .mymask { display: block; margin-top: 80px;}


.login{width: 410px;border: 1px solid #e6e6e6;border-radius: 10px;z-index: 999999;position: fixed;left: 50%;top: 50%;margin-top: -170px;background: #FFF;margin-left: -206px;}
.login > .close, .join > .close{position: absolute;top: 5px;right: 5px;width: 20px;height: 20px;display: block;color: #0168b7;}
.login > dl{padding: 10px 30px;}
.login > dl > dt{border-bottom: 1px solid #ddd;position: relative;height: 45px;margin: 20px 0px; text-align: center}
.login > dl > dt > span{display: inline-block;width: 50%;line-height: 45px;height: 45px;cursor: pointer;text-align: center;font-size: 22px;}
.login > dl > dt > span.active{border-bottom: 1px solid #4889dd;}
.login > dl > dd{padding: 12px 0px;position: relative;}
.login > dl > dd > label{position: absolute;height: 40px;width: 40px;font-size: 28px;color: #ccc;left: 10px;top: 19px;}
.login > dl > dd > span{position: absolute;height: 20px;padding-left: 15px;width: 120px;right: 0px;top: 24px;border-left: 1px solid #ccc;color: #4698e4;cursor: pointer; text-align: center}
.login > dl > dd > input, .login > dl > dd > select{height: 44px;border: 1px solid #e8e8e8;border-radius: 5px;padding: 0px 5px 0px 50px;width: 100%;}

.login > dl > p > span{float: right;}
.login > dl > p > span > a{color: #4698e4;}
.login > dl > dd.phone{display: none;}
.login > dl.phone > dd.phone{display: block;}
.login > dl.phone > dd.pwd{display: none;}

.float-btn{height: 45px;line-height: 45px;text-align: center;display: block;transition: all 0.5s;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-o-transition: all 0.5s;color: #FFF;background: #0168b7;font-size: 18px;border-radius: 5px;}
.float-btn:hover{background: #0a90f7;color: #FFF;}

@media screen and (max-width: 1024px){
	.login{float: none;margin: 0px auto;width: auto;border: none;padding: 0px 5px;left: 5px;right: 5px;top: 100px;}
	.login > dl{padding: 10px 10px;}
	.reg-step > dl > dd > input, .reg-step > dl > dd > select { height: 35px;}
	.reg-step > dl > dd > label {top:5px !important}
}


@media screen and (max-width: 1024px) {
	input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;}
	*  {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;  }
	body { min-width: auto;}
	.m{ width: 100%; padding: 0px 10px; }
	.wm { width: 100%;}
	.header { height: auto; border-bottom: 2px solid #024899; height: 80px;}
	.header>div>a { padding: 0px;text-align: left; line-height: 80px; width: auto; float: none; }
	.header>div>a>img { width: 100%; max-width: 220px; margin-top: 8px;}
	.header>div>i { height: 40px; width: 40px; line-height: 40px; text-align: center; font-size: 32px; color: #FFF; display: block; border-radius: 2%; float: right; position: absolute; right: 5px; top: 30px; }
	.header>div>span { display: none; width: 25px; height: 25px; font-size: 24px; position: absolute;right: 65px; top: 45px; color: #fff;}
	.header>div>p { position: absolute; right: 10px; top: 0px; line-height: 20px;height: 20px;}
	.header>div>ul { height: auto; width: 200px; position: absolute; right: -200px; top: 80px!important; bottom: 0px;overflow-x: visible; overflow-y: auto; transition: all 0.2s linear 0.1s; z-index: 9; background:#024899; line-height: unset; border-top: 1px solid #00387a; display: none;}
	.header>div>ul.active { right:0px; display: block;}
	.header>div>ul>li { width: 100%; line-height: 50px;border-bottom: 1px solid #00387a; text-align: center;padding: 0px;}
	.header>div>ul>li>a{ display: block;}
	.header>div>ul>li>ul { display: block; position: static; background: #F0F0F0; border-radius: 0px;}
	.header>div>ul>li>ul { padding: 0px; border-top: 1px solid #00387a;}
	.header>div>ul>li>ul>li {  border-color: #FFF;}
	.header>div>ul>li>ul>li>a { color: #555;}
	.header>div>ul>li>ul>i { display: none;}
	.header>div>ul>li::after { display: none;}
	.header>div>ul>li.active { }
	.header>div>ul>li.active>a { color: #FFF}
	.header>div>ul>li:hover>a, .nav>ul>li.active>a {}
	.header>div>ul>li.search-btn { display: none;}

	.mtit {  font-size: 24px; font-weight: bold; font-size: 18px; padding: 20px 0px;}
	.mtit>p {font-size: 14px; }
	.footer { padding: 20px 10px;}
	.footer div.qrcode { float: none; text-align: center; }
	.footer div.qrcode>p { float: none; display: inline-block; margin-left:0px; padding: 0px 20px; overflow: hidden; width: auto}
	.footer div.qrcode>p:last-child { display: none;}
	.footer div.info { text-align: center; }
	.footer .info>a { display: inline-block;}



}