@import url("reset.css");
@import url("iconfont.css"); /* unicode iconfont & class iconfont */
@import url('animate.css');
@import url('swiper.css');
@import url('lightgallery.css');

@font-face{font-family:'sysfont';src:url('../fonts/sysfont.ttf') format('truetype');}
@font-face{font-family:'RobotoCondensed';src:url('../fonts/RobotoCondensed.ttf') format('truetype');}

@keyframes mctranslate{0% {transform:translate(0,0);}50%{transform:translate(10px,10px);}100%{transform:translate(0,0);}}
@keyframes mctranslatex{0% {transform:translateX(-5px);}50%{transform:translateX(5px);}100%{transform:translateX(-5px);}}
@keyframes mctranslatey{0% {transform:translateY(0);}50%{transform:translateY(10px);}100%{transform:translateY(0);}}
@keyframes mcscale{0% {transform:scale(1);}50%{transform:scale(1.05);}100%{transform:scale(1);}}
@keyframes mcscalex{0% {transform:scaleX(1);}50%{transform:scaleX(1.05);}100%{transform:scaleX(1);}}
@keyframes mcscaley{0% {transform:scaleY(1);}50%{transform:scaleY(1.05);}100%{transform:scaleY(1);}}
@keyframes mcrotate{0% {transform:rotate(0);}50%{transform:rotate(180deg);}100%{transform:rotate(360deg);}}
@keyframes mcrotatex{0% {transform:rotateX(0);}50%{transform:rotateX(180deg);}100%{transform:rotateX(360deg);}}
@keyframes mcrotatey{0% {transform:rotateY(0);}50%{transform:rotateY(180deg);}100%{transform:rotateY(360deg);}}
@keyframes mcrotatez{0% {transform:rotateZ(0);}50%{transform:rotateZ(180deg);}100%{transform:rotateZ(360deg);}}
@keyframes mcskew{0% {transform:skew(0,0);}50%{transform:skew(180deg,180deg);}100%{transform:skew(360deg,360deg);}}
@keyframes mcskewx{0% {transform:skewX(0);}50%{transform:skewX(180deg);}100%{transform:skewX(360deg);}}
@keyframes mcskewy{0% {transform:skewY(0);}50%{transform:skewY(180deg);}100%{transform:skewY(360deg);}}
@keyframes mcopacity{0% {opacity:0.5;}50%{opacity:1;}100%{opacity:0.5;}}
/*
animation:xxx 3s infinite ease-in-out;-webkit-animation:xxx 3s infinite ease-in-out;
*/

::selection{background:#182fa3;color:#fff;}
body{font-family:'Microsoft YaHei';color:#333;line-height:20px;}
a{color:#333;}a:hover{color:#c7000a;} /* link-visited-hover-active */
.icon{width:1em;height:1em;vertical-align:-0.15em;fill:currentColor;overflow:hidden;} /* js iconfont */

@media (min-width:1441px){/* DESKTOPS */
body{font-size:14px;}
.wrow,.wrowr,.wcol{display:flex;justify-content:space-between;margin:0 auto;width:1200px;box-sizing:border-box;}
.wrowr{flex-direction:row-reverse;}
.wcol{flex-direction:column;}
header{
	position: fixed;
    z-index:999;
    top: 0;
    left: 0;
    right: 0;
	background: rgba(0, 0, 0, 0);
    transition: all ease-out 0.3s;
	border-bottom: 1px solid rgba(255,255,255,.1);
}
	.head{display:flex;justify-content:space-between;padding: 0px 50px;}
		.headlogo{margin-right:20px;}
			.headlogo a{display:block;}
			.headlogo img{height:70px;}		
			
		.headsearch{display:none;}
			.headsearch form{background:#0050be;border-radius:40px;margin:20px;}
			.headsearch input{box-sizing:border-box;background:none;}
			.headsearch input.txt{height:40px;padding:0 20px;color:#fff;width:190px;transition:all 0.3s ease-out 0s;}
			.headsearch input.txt::-webkit-input-placeholder{color:rgba(255,255,255,0.5);}
			.headsearch input.btn{position:absolute;top:25px;right:25px;width:30px;height:30px;color:#fff;}
	.nav{}
		nav{}
			nav>ul{}
			nav>ul>li{float:left;position:relative;}
			nav>ul>li>a{position:relative;z-index:1;display:block;font-size:16px;line-height:80px;padding:0 30px;color:#fff;}
			nav>ul>li>a>span{float:right;padding-left:5px;color:#fff;font-weight:bold;}
			nav>ul>li.on>a,nav li a:hover{color:#fff;}
			nav li a.on{}
			nav li ul{display:none;position:absolute;z-index:9;top:80px;left:0;width:300px;box-shadow:0 3px 3px rgba(0,0,0,0.1);background: rgba(0, 0, 0, 1);}
			nav li li{}
			nav li li a{font-size:14px;display:block;line-height:40px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative;font-weight:normal;padding:0 45px;color:#fff;}
			nav li li a:before{content:'';display:block;position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,0.05);height:1px;}
			nav li li a:after{content:'';display:block;position:absolute;top:50%;right:30px;width:10px;height:10px;border-top:1px solid #fff;border-right:1px solid #fff;transform:translateY(-50%) rotate(45deg);transition:all ease-out 0.3s;left:auto;background:transparent;}
			nav li li a:hover{padding:0 50px;color:#c7000a;}
			nav li li a:hover:after{width:10px;right:35px;}
			.hotbarsearch {
				width: 100px;
				display: none;
			}
			.hotbarsearch form {
				float: right;
				border: 1px solid #fff;
				height: 36px;
				border-radius: 30px;
				margin: 6px 0;
				padding: 0 0 0 15px;
			}
			.hotbarsearch form input {
				height: 36px;
				background: none;
				caret-color: #fff;
			}
			.hotbarsearch form input.btn {
				float: right;
				display: block;
				width: 36px;
				background: url(../images/ss.png) no-repeat 50%;
				text-indent: -999em;
			}
			.lyen {
				width: 40px;
				height: 40px;
				line-height: 40px;
				text-align: center;
				border: 1px solid #fff;
				border-radius: 50%;
				margin-top: 19px;
			}
			.lyen a {color:  #fff;}
header.fixed,header:hover{background: rgba(0, 0, 0, 1);}
header.fixed nav a,header:hover nav a{}
header.fixed .headtel a,header:hover .headtel a{color:#333;}

footer{background:#1a1a1a;}
footer a{color:#fff;}
	.foot{
		width: 100%;
        max-width: 1240px;
        min-width: 0px;
        height: auto;
        max-height: none;
        min-height: 192px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 25px;
        padding-top: 40px;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 0px;
	}
		.footmain{display:flex;justify-content:space-between;margin:0 -30px;}
			.footmain>div{color: #fff;}
			.footnav{line-height:30px;width: 40%;}
			    .footnav>ul{}
			    .footnav>ul>li{margin-right:80px;}
			    .footnav>ul>li:last-child{margin-right:0;}
			    .footnav>ul>li>a{display:block;color:#fff;font-size:17px;margin-bottom:30px;position:relative;font-weight:bold;}
				.footnav .wechat dl {
                    display: inline-block;
					padding: 15px 15px 0px 0px;
				}
				.footnav .wechat dl dt {
					text-align: center;
				}
			
			    .footnav>ul>li>a i{float:right;}
			    .footnav>ul>li ul{}
			    .footnav>ul>li li{}
			    .footnav>ul>li li a{}
			.footcontact{line-height:30px;width: 33%;}
				.footcontact h3{font-weight:bold;display:block;font-size:17px;margin:0 0 30px;position:relative;}
				.footcontact section{line-height:25px;}
				.footcontact section p{display:flex;align-items:center;}
				.footcontact section p svg{font-size:22px;margin-right:10px;}
            .footmessage{width: 27%;}
			.footmessage h3 {
				font-weight: bold;
				display: block;
				font-size: 17px;
				margin: 0 0 30px;
				position: relative;
			}
			.footmessage li {position: relative;
				margin-bottom: 20px;
				box-sizing: border-box;}
			.footmessage li span {display: none;}
			.footmessage li input {
				width: 50%;
				padding: 11px;
				box-sizing: border-box;
				background: #f6f6f6;
			}
			.footmessage li img {
				position: absolute;
				top: 7px ;
				left: 170px;
			}
			.footmessage li textarea {
				display: block;
				border: none;
				width: 80%;
				height: 60px;
				padding: 20px;
				box-sizing: border-box;
				background: #f6f6f6;
			}
	.copy{text-align:center;padding:20px 0;overflow:hidden;font-size:12px;border-top:1px solid rgba(255,255,255,0.1);background: #000;}
		.copyinfo{float:left;color: #fff;}
			.copyinfo span{margin-right:10px;}
			.copyinfo a{}
		.copysupport{float:right;}
			.copysupport a{margin-left:10px;}
}
@media (min-width:1025px) and (max-width:1440px){/* LAPTOPS */
	body{font-size:14px;}
	.wrow,.wrowr,.wcol{display:flex;justify-content:space-between;margin:0 auto;box-sizing:border-box;padding: 0 50px;}
	.wrowr{flex-direction:row-reverse;}
	.wcol{flex-direction:column;}
	header{
		position: fixed;
		z-index: 999;
		top: 0;
		left: 0;
		right: 0;
		background: rgba(0, 0, 0, 0);
		transition: all ease-out 0.3s;
		border-bottom: 1px solid rgba(255,255,255,.1);
	}
		.head{display:flex;justify-content:space-between;padding: 0 50px;}
			.headlogo{margin-right:20px;}
				.headlogo a{display:block;}
				.headlogo img{height:70px;}
			.headtel{float:right;overflow:hidden;}
				.headtel i{float:left;width:50px;height:50px;text-align:center;line-height:50px;font-size:40px;border: 1px solid #0050be;color:#0050be;border-radius:70px;margin:5px 10px;}
				.headtel dl{padding:10px 0;}
				.headtel dt{color:#999;}
				.headtel dd{font-size:24px;line-height:30px;font-weight:bold;color:#c00;}
			.headsearch{display:none;}
				.headsearch form{background:#0050be;border-radius:40px;margin:20px;}
				.headsearch input{box-sizing:border-box;background:none;}
				.headsearch input.txt{height:40px;padding:0 20px;color:#fff;width:190px;transition:all 0.3s ease-out 0s;}
				.headsearch input.txt::-webkit-input-placeholder{color:rgba(255,255,255,0.5);}
				.headsearch input.btn{position:absolute;top:25px;right:25px;width:30px;height:30px;color:#fff;}
		.nav{}
			nav{}
				nav>ul{}
				nav>ul>li{float:left;position:relative;}
				nav>ul>li>a{position:relative;z-index:1;display:block;font-size:16px;line-height:80px;padding:0 30px;color:#fff;}
				nav>ul>li>a>span{float:right;padding-left:5px;color:#fff;font-weight:bold;}
				nav>ul>li.on>a,nav li a:hover{color:#fff;}
				nav li a.on{}
				nav li ul{display:none;position:absolute;z-index:9;top:80px;left:0;width:300px;box-shadow:0 3px 3px rgba(0,0,0,0.1);background: rgba(0, 0, 0, 1);}
				nav li li{}
				nav li li a{font-size:14px;display:block;line-height:40px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative;font-weight:normal;padding:0 45px;color:#fff;}
				nav li li a:before{content:'';display:block;position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,0.05);height:1px;}
				nav li li a:after{content:'';display:block;position:absolute;top:50%;right:30px;width:10px;height:10px;border-top:1px solid #fff;border-right:1px solid #fff;transform:translateY(-50%) rotate(45deg);transition:all ease-out 0.3s;left:auto;background:transparent;}
				nav li li a:hover{padding:0 50px;color:#c7000a;}
				nav li li a:hover:after{width:10px;right:35px;}
				.hotbarsearch {
					width: 100px;
					display: none;
				}
				.hotbarsearch form {
					float: right;
					border: 1px solid #fff;
					height: 36px;
					border-radius: 30px;
					margin: 6px 0;
					padding: 0 0 0 15px;
				}
				.hotbarsearch form input {
					height: 36px;
					background: none;
					caret-color: #fff;
				}
				.hotbarsearch form input.btn {
					float: right;
					display: block;
					width: 36px;
					background: url(../images/ss.png) no-repeat 50%;
					text-indent: -999em;
				}
				.lyen {
					width: 40px;
					height: 40px;
					line-height: 40px;
					text-align: center;
					border: 1px solid #fff;
					border-radius: 50%;
					margin-top: 19px;
				}
				.lyen a {color:  #fff;}
	header.fixed,header:hover{background: rgba(0, 0, 0, 1);}
	header.fixed nav a,header:hover nav a{}
	header.fixed .headtel a,header:hover .headtel a{color:#333;}
	
	footer{background:#1a1a1a;}
	footer a{color:#fff;}
		.foot{
			width: 100%;
			max-width: 1240px;
			min-width: 0px;
			height: auto;
			max-height: none;
			min-height: 192px;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: 25px;
			padding-top: 40px;
			padding-left: 20px;
			padding-right: 20px;
			padding-bottom: 0px;
		}
			.footmain{display:flex;justify-content:space-between;}
				.footmain>div{color: #fff;}
				.footnav{line-height:30px;width: 40%;}
					.footnav>ul{}
					.footnav>ul>li{margin-right:80px;}
					.footnav>ul>li:last-child{margin-right:0;}
					.footnav>ul>li>a{display:block;color:#fff;font-size:17px;margin-bottom:30px;position:relative;font-weight:bold;}
					.footnav .wechat dl {
						display: inline-block;
						padding: 15px 15px 0px 0px;
					}
					.footnav .wechat dl dt {
						text-align: center;
					}
					.footnav>ul>li>a i{float:right;}
					.footnav>ul>li ul{}
					.footnav>ul>li li{}
					.footnav>ul>li li a{}
				.footcontact{line-height:30px;width: 33%;}
					.footcontact h3{font-weight:bold;display:block;font-size:17px;margin:0 0 30px;position:relative;}
					.footcontact section{line-height:25px;}
					.footcontact section p{display:flex;align-items:center;}
					.footcontact section p svg{font-size:22px;margin-right:10px;}
				.footmessage{width: 27%;}
				.footmessage h3 {
					font-weight: bold;
					display: block;
					font-size: 17px;
					margin: 0 0 30px;
					position: relative;
				}
				.footmessage li {position: relative;
					margin-bottom: 20px;
					box-sizing: border-box;}
				.footmessage li span {display: none;}
				.footmessage li input {
					width: 50%;
					padding: 11px;
					box-sizing: border-box;
					background: #f6f6f6;
				}
				.footmessage li img {
					position: absolute;
					top: 7px ;
					left: 170px;
				}
				.footmessage li textarea {
					display: block;
					border: none;
					width: 80%;
					height: 60px;
					padding: 20px;
					box-sizing: border-box;
					background: #f6f6f6;
				}
		.copy{text-align:center;padding:20px 0;overflow:hidden;font-size:12px;border-top:1px solid rgba(255,255,255,0.1);background: #000;}
			.copyinfo{float:left;color: #fff;}
				.copyinfo span{margin-right:10px;}
				.copyinfo a{}
			.copysupport{float:right;}
				.copysupport a{margin-left:10px;}
	}
@media (max-width:1024px){/* MOBILE */
body{font-size:12px;padding-top:60px;}
header{position:fixed;z-index:3;top:0;left:0;right:0;box-shadow:0 0 20px rgba(0,0,0,0.1);background:#333;}
	.head{display:flex;justify-content:space-between;padding:10px;}
		.headlogo{}
			.headlogo a{display:block;}
			.headlogo img{height:40px;}
		.headtel{float:right;overflow:hidden;width:400px;}
			.headtel i{float:left;width:60px;height:60px;text-align:center;line-height:60px;font-size:50px;background:#ffff;color:#fff;border-radius:70px;margin:5px 10px;}
			.headtel dl{padding:10px 0;}
			.headtel dt{color:#999;}
			.headtel dd{font-size:24px;line-height:30px;font-weight:bold;color:#c00;}
		.hotbarsearch{display:none;}
	.nav{background:#0050be;}
			nav{}
				nav span{position:absolute;z-index:99;top:3px;right:10px;display:block;width:60px;padding:5px 15px;box-sizing:border-box;}
				nav span:after{content:'导航菜单';clear:both;position:absolute;top:35px;right:0;width:60px;text-align:center;color:#fff;text-align:center;}
				nav span i{display:block;content:'';width:100%;height:2px;background:#ffff;margin:6px 0;transition:all 0.3s ease-out 0.1s;}
				nav span.on i:nth-of-type(1){transform:translateY(8.5px) rotate(45deg);}
				nav span.on i:nth-of-type(2){opacity: 0;}
				nav span.on i:nth-of-type(3){transform:translateY(-8.5px) rotate(-45deg);}
				nav ul{position:fixed;z-index:99;right:-300px;bottom:0;top:60px;width:200px;background:rgba(255,255,255,1);box-shadow:0 30px 30px rgba(0,0,0,0.1);transition:all ease-out 0.3s;}
				nav ul.on{right:0;}
				nav ul li{position:relative;}
				nav ul li i{position:absolute;z-index:1;top:0;right:0;width:40px;height:40px;background:rgba(0,0,0,0.1);text-align:center;line-height:40px;font-style:normal;}			
				nav ul li span{display:none;}
				nav li a{display:block;line-height:40px;font-size:14px;padding:0 20px;border-bottom:1px solid rgba(0,0,0,0.1);}
				nav li a:hover{background:#0050be;color:#fff;}
				nav li ul{display:none;position:static;overflow:hidden;box-shadow:none;background:none;}
				nav li ul.on{display:block;}
				nav li li{float:left;width:50%;}
				nav li li a{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#999;}
		.headtel{display:none;}

		.lyen {
			
			width: 40px;
			line-height: 40px;
			text-align: center;
			border: 1px solid #fff;
			border-radius: 50%;
			position: absolute;
			left: 60%;
		
		}
		.lyen a {color:  #fff;}

		footer{background-image: linear-gradient(-45deg,#222 0,#222 50%,#1f1f1f 50%,#1f1f1f 100%);background-size:auto 100%;}
footer a{color:#fff;}
	.foot{padding:30px 20px;}
		.footmain{}
			.footnav{margin-bottom:20px;color: #fff;}
				.footnav h3{font-weight:bold;display:block;font-size:17px;margin:0 0 20px;position:relative;}
				.footnav>ul{}
				.footnav>ul>li{margin-bottom: 10px;}
				.footnav>ul>li li {
					float: left;
					margin-right: 10px;
				}
				.footnav>ul>li>a{    
					display: block;
					color: #fff;
					font-size: 15px;
					margin-bottom: 10px;
					position: relative;
					font-weight: bold;
				}
				.footnav .wechat dl {
                    display: inline-block;
					padding: 15px 15px 0px 0px;
				}
				.footnav .wechat dl dt {
					text-align: center;
				}
				
				.footnav>ul>li>a:hover{background:#0050be;color:#fff;}
			.footcontact{margin-bottom:20px;color: #fff;}
				.footcontact h3{font-weight:bold;display:block;font-size:15px;margin:0 0 20px;position:relative;}
			
				.footcontact section{line-height:25px;}
				.footcontact section p{display:flex;align-items:center;}
				.footcontact section p svg{font-size:22px;margin-right:10px;}
			.footqrcode{color: #fff;}
				.footqrcode h3{font-weight:bold;display:block;font-size:15px;margin:0 0 40px;position:relative;}
				.footqrcode h3:after{content:'';display:block;position:absolute;top:30px;left:0;width:30px;height:2px;background:#0050be;}
					.footqrcode ul{display:flex;margin:0 -5px;}
					.footqrcode li{flex:1;margin:0 5px;}
					.footqrcode figure{}
					.footqrcode img{width:100px;border:1px solid rgba(0,0,0,0.1);}
					.footqrcode figcaption{font-size:12px;}
					.footqrcode p{text-align:center;}
			
			.footmessage{}
			.footmessage h3 {
				font-weight: bold;
				display: block;
				font-size: 15px;
				margin: 0 0 20px;
				position: relative;
				color: #fff;
			}
			.footmessage li {position: relative;
				margin-bottom: 20px;
				box-sizing: border-box;}
			.footmessage li span {display: none;}
			.footmessage li input {
				width: 50%;
				padding: 11px;
				box-sizing: border-box;
				background: #f6f6f6;
			}
			.footmessage li img {
				position: absolute;
				top: 7px ;
				left: 170px;
			}
			.footmessage li textarea {
				display: block;
				border: none;
				width: 80%;
				height: 60px;
				padding: 20px;
				box-sizing: border-box;
				background: #f6f6f6;
			}
	.copy{text-align:center;padding:20px 20px 80px;overflow:hidden;border-top:1px solid rgba(255,255,255,0.1);color: #fff;}
		.copyinfo{}
			.copyinfo span{margin-right:10px;}
			.copyinfo a{}
		.copysupport{}
			.copysupport a{margin-left:10px;}
}

@media (min-width:768px){/* TABLET */
	.sidebar{position:fixed;z-index:99;top:50%;transform:translateY(-50%);right:0;width:50px;font-size:12px;}
		.sidebar ul{}
		.sidebar li{position:relative;border-bottom:2px solid transparent;}
			.sidebar li i{display:block;position:relative;z-index:2;font-style:normal;text-align:center;background:#333;color:#fff;padding:5px 0;cursor:pointer;}
			.sidebar li i svg{font-size:30px;line-height:30px;}
			.sidebar li i span{display:block;}
			.sidebar li section{position:absolute;z-index:-1;top:50%;transform:translateY(-50%);left:72px;transition:all ease-out 0.3s;border-right:2px solid transparent;opacity:0;}
			.sidebar li section.sidebartel dl{background:#333;color:#fff;padding:15px;border-right:2px solid transparent;box-sizing:content-box;width:160px;}
			.sidebar li section.sidebartel dd{font-weight:bold;font-size:18px;line-height:25px;font-family:'iconfont';}
			.sidebar li section.sidebartel dd a{color:#1c8f59;}
			.sidebar li section.sidebarqrcode dl{display:inline-block;text-align:center;padding:5px;background:#333;color:#fff;margin:1px 0;}
			.sidebar li section.sidebarqrcode dd{margin-bottom:5px;}
			.sidebar li section.sidebarqrcode dd img{width:100px;}
			.sidebar li:hover section.sidebartel{z-index:1;left:-194px;opacity:1;}
			.sidebar li:hover section.sidebarqrcode{z-index:1;left:-112px;opacity:1;}
	}
	@media (max-width:767px){/* MOBILE */
	.sidebar{position:fixed;z-index:3;right:0;bottom:0;left:0;}
		.sidebar ul{position:relative;}
		.sidebar li{float:left;width:25%;}
			.sidebar li i{display:block;z-index:2;font-style:normal;text-align:center;background:#333;color:#fff;padding:5px 0;cursor:pointer;}
			.sidebar li i svg{font-size:30px;}
			.sidebar li i span{display:block;}
			.sidebar li section{position:absolute;z-index:-1;bottom:-60px;left:50%;transform:translateX(-50%);transition:all ease-out 0.3s;opacity:0;white-space:nowrap;}
			.sidebar li section.sidebartel dl{background:#333;color:#fff;padding:15px;box-sizing:content-box;}
			.sidebar li section.sidebartel dd{font-size:22px;font-weight:bold;line-height:30px;font-family:'iconfont';}
			.sidebar li section.sidebartel dd a{color:#f60;}
			.sidebar li section.sidebarqrcode dl{display:inline-block;text-align:center;padding:5px;background:#333;color:#fff;}
			.sidebar li section.sidebarqrcode dd{margin-bottom:5px;}
			.sidebar li section.sidebarqrcode dd img{width:100px;}
			.sidebar li:hover section.sidebartel{bottom:62px;opacity:1;}
			.sidebar li:hover section.sidebarqrcode{bottom:62px;opacity:1;}
	}