@font-face {
    font-family: 'ar';
    src: url(font.ttf);
    font-weight: 100;
}
*{
	margin:0;padding:0;list-style: none;font-family: "ar";
}
#box{
	max-width:600px;margin:auto
}
/*å¤´éƒ¨*/
.banner{
	width: 100%;position: relative;
}
.banner img{
	width: 100%;
}
.banner h3{
	position: absolute;top:7%;font-style:italic;font-weight: 900;
	font-size: 20px;color:#2c2a2d;text-align: left;width: 100%;
}
.banner h3 span{
	color:#fff;
	font-size:22px !important;font-weight: 900;padding-left: 6%;padding-right: 5%;
}
.banner h3 i{
	color:#8626e0;
}
.banner p{
	position: absolute;top:37.3%;font-weight: 900;
	font-size: 22px;color:#2c2a2d;text-align: center;width: 100%;
}
.banner ul{
	width: 80%;position: absolute;
	top:46%;left:0;right:0;margin:auto
}
.banner ul li{
	width:33%;float: left;text-align: center;color: #fff;
}
.banner ul li h2{font-size: 20px;padding-bottom: 5px;}
.banner ul li h6{font-size: 15px;}
/*ä½ æ˜¯å¦æœ‰ä»¥ä¸‹å›°æ‰°*/
.perplex{
	width: 100%;position: relative;margin-top:-8px
}
.perplex img{
	width: 100%;
}
.perplex div{
	position: absolute;
	top:5%;left:0;right:0;
	width:56%;text-align: center;margin:auto
}
.perplex div img{
	width: 20px;
}
#perplex-t-l{
	display: block;float:left;margin-top: 4%;
}
#perplex-t-r{
	display: block;float:right;margin-top: 4%;
}
.perplex div h6{
	color: #393939;
}
.perplex div h6{
	font-size: 14px;font-weight: 900;color: #979797;
}
.perplex-con-1,.perplex-con-2{
	width: 92%;position: absolute;
	bottom:44%;left:0;right:0;
	margin:auto;text-align: left;color: #262626;font-size: 17px;
}
.perplex-con-1 span{display: block;width: 32%;}
.perplex-con-1 span:nth-child(1){float: left;}
.perplex-con-1 span:nth-child(2){float: left;padding:0 2%}
.perplex-con-1 span:nth-child(3){float: right;}
.perplex-con-2{
	bottom:6%
}
/*å©šå§»å±æœºï¼Ÿå©šå§»ä¸“å®¶æ•™ä½ ç§‘å­¦è§£å†³*/
.crisis{
	width: 100%;position: relative;margin-top:-8px
}
.crisis img{
	width: 100%;
}
.crisis h1{
	position: absolute;
	top:4%;left:0;right:0;margin:auto;
	width:90%;text-align: center;
}
.crisis ul{
	width: 90%;position: absolute;top:16%;left:0;right:0;
	margin:auto
}
.crisis ul li{
	width: 28%;float: left;
}
.crisis ul li:nth-child(2){padding:0 8%}
.crisis ul li h4{color:#8626e0;font-size: 23px;padding-bottom: 24%;}
.crisis ul li p{color:#3a3b3f;font-size: 17px;text-align: justify;}
#crisis-con{
	top:39.5%
}
#crisis-pro{
	position: absolute;
	bottom:4.6%;left:10%;
	width:43%;color: #8626e0;font-size: 20px;
}
#crisis-pro p{
	padding-bottom: 3.5%;
}
.crisis-pro-1{text-align: left;}
.crisis-pro-2{text-align: right;}
.crisis h2{
	position: absolute;
	bottom:30%;left:5%;
	width:40%;
	font-size: 22px;color: #262626;
}
.crisis h2 span{
	font-size: 30px;color: #8626e0;font-weight: 900;
}
/*å…³äºŽçˆ±ç‡ƒ*/
.about{
	width: 100%;position: relative;margin-top:-8px
}
.about img{
	width: 100%;
}
.about div{
	position: absolute;
	top:5%;left:0;right:0;
	width:38%;text-align: center;margin:auto
}
.about div img{
	width: 20px;
}
#about-t-l{
	display: block;float:left;margin-top: 4%;
}
#about-t-r{
	display: block;float:right;margin-top: 4%;
}
.about p{
	position: absolute;
	top:13%;left:0;right:0;text-indent:35px;
	width:90%;text-align: justify;margin:auto;font-size: 18px;color: #262626;
}
.about h5{
	position: absolute;
	top:36%;left:3%;text-align: left;
	width:30%;font-size: 19px;color: #8626e0;
}
.about ul{
	width: 93%;
	position: absolute;
	bottom:28%;left:0;right:0;margin:auto
}
.about ul li{
	float: left;width: 30%;color: #262626;text-align: center;
}
.about ul li:nth-child(2){padding:0 5%}
.about ul li span{font-size: 16px;}
.about ul li h6{font-size: 14px;}
.about h5:nth-child(4){top:auto;bottom:24%}
/*æˆ‘ä»¬æ“…é•¿åº”å¯¹è¿™äº›é—®é¢˜å¿«é€Ÿæœ‰æ•ˆæŒ½å›ž*/
.skilled{
	width: 100%;position: relative;margin-top:-8px;background-image: url("../img/img-5.jpg");
	background-size: 100% 100%;padding-bottom: 20px;
}
.skilled div{
	width:64%;text-align: center;margin:auto;padding-top: 4%;
}
.skilled div img{
	width: 20px;
}
.skilled div h4{
	color: #343434;font-size: 20px;
}
#skilled-t-l{
	display: block;float:left;margin-top: 3%;
}
#skilled-t-r{
	display: block;float:right;margin-top: 3%;
}
.skilled ul {
	width: 94%;margin:4.2% 0 0 2%;padding-bottom: 20px;
}
.skilled ul li{width: 100%;margin-bottom: 10px;border-bottom: 1px dashed#999;padding-left: 2%;}
.skilled ul li h5{
	font-size: 22px;color: #343434;
}
.skilled ul li h5 span{
	font-size: 28px;padding-right: 10px;
}
.skilled ul li p{
	font-size: 18px;color: #262626;text-align: justify;
	padding:10px 0 15px 0;padding-left: 4%;width: 93%;
}
.skilled aside{
	width: 100%;position: relative;
}
.skilled aside img{width: 100%;}
.skilled aside span{
	width: 70%;height: 78%;
	position: absolute;
	top:0;right:0;left:0;bottom:0;margin:auto;
	font-size: 28px;color: #fff;text-align: center;line-height: 2.1;
}
/*ä¸ºä»€ä¹ˆé€‰æ‹©çˆ±ç‡ƒ*/
.choice{
	width: 100%;position: relative;margin-top:-8px
}
.choice img{
	width: 100%;
}
.choice div{
	position: absolute;
	top:5%;left:0;right:0;
	width:52%;text-align: center;margin:auto
}
.choice div img{
	width: 20px;
}
#choice-t-l{
	display: block;float:left;margin-top: 4%;
}
#choice-t-r{
	display: block;float:right;margin-top: 4%;
}
.choice p{
	position: absolute;
	top:37%;left:0;right:0;width: 91%;font-size: 20px;color:#fff;margin:auto;text-align: center;
}
.choice p span{width:30%;display: block;float: left;}
.choice p span:nth-child(2){padding:0 5%}
.choice h4{
	position: absolute;
	top:49%;left:0;right:0;width: 91%;font-size: 24px;margin:auto;text-align: center;
}
.choice ul{
	position: absolute;
	bottom:5%;left:0;right:0;width: 91%;margin:auto
}
.choice ul li{
	width: 100%;font-size: 20px;color: #262626;padding:2% 0;margin-bottom: .9%;
}
.choice ul li span{
	color: #fff;font-size: 28px;font-weight: 900;padding:0 6% 0 2%
}
/*ä¸“ä¸šæƒ…æ„Ÿå¯¼å¸ˆå›¢é˜Ÿ*/
.major{
	width: 100%;position: relative;margin-top:-8px
}
.major img{
	width: 100%;
}
.major div{
	position: absolute;
	top:5%;left:0;right:0;
	width:52%;text-align: center;margin:auto
}
.major div img{
	width: 20px;
}
#major-t-l{
	display: block;float:left;margin-top: 4%;
}
#major-t-r{
	display: block;float:right;margin-top: 4%;
}
.major ul{
	position: absolute;
	top:37.5%;left:0;right:0;width: 91%;margin:auto
}
.major ul li{width: 30%;float: left;color:#262626}
.major ul li h3{font-size: 22px;text-align: center;}
.major ul li p{font-size: 17px;text-align: justify;}
.major ul li:nth-child(2){padding:0 5%}
.major ul:nth-child(4){top:80.5%;}
/*å†…å®¹*/
.section{
	width: 100%;margin-top:-5px;background-image: url("../img/img-9.jpg");
	background-size: 100% 100%;padding: 12px 0 16px 0;
}
.section p{font-size: 18px;color: #262626;width:90%;margin:auto;text-align: justify;padding:16px 0 5px 0}
.section p span{color: #fa2922;font-weight: 900;font-size: 19px;}
#section-r{display: block;}
/*æˆåŠŸæ¡ˆä¾‹*/
.success{
	width: 100%;background-image: url("../img/img-9.jpg");
	background-size: 100% 100%;
}
.success div{
	width:90%;text-align: center;margin:auto;border-bottom: 1px dashed#999;padding:20px 0 10px 0
}
.success div h1{width:35%;margin:auto}
.success div img{
	width: 20px;
}
#success-t-l{
	display: block;float:left;margin-top: 6%;
}
#success-t-r{
	display: block;float:right;margin-top: 6%;
}
.success ul{width: 90%;margin:auto;overflow: auto;}
.success ul a li{width: 100%;overflow: auto;padding:15px 0;border-bottom:1px solid#f5f5f5;color: #000}
.success ul a li h4{
	width: 70%;font-size: 20px;float: left;overflow: hidden;margin-right: 2%;
    white-space: nowrap;
    text-overflow: ellipsis;padding-bottom: 5px;color: #000
}
.success ul a li p{
	width: 70%;font-size: 18px;float: left;text-overflow: ellipsis;
    display: -webkit-box;overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;color:#4fb2e0
}
.success ul a li img{
	width: 28%;display: block;border-radius: 6px;
}
.success ul a li:nth-child(15){border:0}
/*å®¢æˆ·åé¦ˆ*/
.feedback{
	width: 100%;background-image: url("../img/img-9.jpg");
	background-size: 100% 100%;padding-bottom: 20px;
}
.feedback div{
	width:90%;text-align: center;margin:auto;border-bottom: 1px dashed#999;padding:20px 0 10px 0
}
.feedback div h1{width:35%;margin:auto}
.feedback div img{
	width: 20px;
}
#feedback-t-l{
	display: block;float:left;margin-top: 6%;
}
#feedback-t-r{
	display: block;float:right;margin-top: 6%;
}
.feedback h4{
	color: #262626;font-size: 20px;width: 90%;margin:auto;padding:4px 0 6px 0
}
.feedback p{
	color:#3a3b3f;font-size: 17px;background: #fff3f5;width: 90%;margin:auto;text-align: justify;border-radius: 5px;padding:4px
}
/*æƒ…æ„Ÿå’¨è¯¢æŒ‡å¯¼æµç¨‹*/
.flow{
	width: 100%;position: relative;
}
.flow img{
	width: 100%;
}
.flow div{
	position: absolute;
	top:12%;left:0;right:0;
	width:52%;text-align: center;margin:auto
}
.flow div img{
	width: 20px;
}
#flow-t-l{
	display: block;float:left;margin-top: 4%;
}
#flow-t-r{
	display: block;float:right;margin-top: 4%;
}
.flow ul{
	position: absolute;
	bottom:15%;left:0;right:0;width: 100%;margin:auto
}
.flow ul li{
	width: 17%;font-size: 20px;color: #262626;padding:0 3%;float: left;text-align: center;
}
.flow ul li:nth-child(2){padding-left: 6%;}
.flow ul li:nth-child(3){padding-left: 5%;}
.flow ul li:nth-child(4){padding-left: 6%;}
/*æœåŠ¡ä¿éšœ*/
.safeguard{
	width: 100%;position: relative;margin-top: -5px;
}
.safeguard img{
	width: 100%;
}
.safeguard div{
	position: absolute;
	top:12%;left:0;right:0;
	width:32%;text-align: center;margin:auto
}
.safeguard div img{
	width: 20px;
}
#safeguard-t-l{
	display: block;float:left;margin-top: 5%;
}
#safeguard-t-r{
	display: block;float:right;margin-top: 5%;
}
.safeguard p{
	position: absolute;bottom:24%;left:0;right:0;width: 94%;text-align: center;
	font-size: 25px;color: #262626;margin:auto
}
.safeguard p span{
	color: #ff4168;font-size: 28px;font-weight: 900;
}
/*åº•éƒ¨*/
.footer{
	width: 100%;padding-bottom: 50px;
}
.footer h3{
	color:#ff4168;font-size: 30px;text-align: center;padding:10px 0
}
.footer h6{
	font-size: 20px;color: #ff4168;text-align: center;width: 94%;margin:auto
}
.footer div{
	width: 100%;padding:10px 0;background-color: #393939;text-align: center;color: #fff;font-size: 16px;margin-top: 5px;
}
.footer div a{
	color: #fff;text-decoration-line:none
}
/*åº•éƒ¨æ‚¬æµ®*/
.bottomwx{
	width: 600px;position: fixed;bottom:0
}
.bottomwx p img{
	width: 40px;display: block;float: left;margin-right: 10px;
}
.bottomwx p{
	padding:5px 2%;width: 60%;float: left;line-height: 2;color: #fff;background: #302825;font-size: 20px;
}
.bottomwx a{
	width: 36%;float: right;
	text-align: center;background: #e50150;color: #fff;text-decoration-line:none;font-size: 24px;height: 100%;display: block;height: 50px;line-height: 50px;
}
/*å¼¹å‡ºå±‚*/
#mb{
	position: fixed;top:0;left:0;width: 100%;height: 100%;background: #262626;opacity: .5;z-index: 99;display: none;
}
.popup {
	position: fixed;top:0;left:0;right:0;bottom:0;margin:auto;width: 400px;z-index: 100;height: 410px;display: none;
}
.popup img{
	width: 100%;    height: 100%;
}
.popup p{
	position: absolute;bottom:28.5%;font-size:20px;color: #ff6267;width: 50%;left:0;right:0;margin:auto;text-align: center;font-weight: 900;
}
#popup-off{
	position: absolute;right:0;top:0;padding:5%;display: block;
}
#popup-wechat{
	position: absolute;    right: 0;
    bottom: 9%;
    left: 0;
    margin: auto;
    width: 60%;
    height: 9%;
}



@media(max-width: 600px){
	.bottomwx {width: 100%;}
}
@media(max-width: 580px){
	.banner h3 span {
	    padding-left: 4%;
	    padding-right: 4%;
	}
	.banner ul {top: 45%;}
	h1{font-size: 28px;}
	.perplex-con-1, .perplex-con-2 {font-size: 16px;}
	.crisis ul li h4 {font-size: 20px;padding-bottom: 20%;}
	.crisis ul li p {font-size: 16px;}
	.crisis h2 {width: 50%;}
	.crisis h2 span {font-size: 26px;}
	#crisis-pro {
	    bottom: 4.6%;
	    font-size: 18px;
	}
	.about p {font-size: 17px;}
	.about h5 {top: 35%;font-size: 17px;}
	.about ul li span {font-size: 15px;}
	.about ul li h6 {font-size: 13px;}
	.choice ul li span {font-size: 25px;}
	.choice ul li {font-size: 18px;}
	.major ul li h3 {font-size: 18px;}
	.major ul li p {font-size: 16px;}
	.success ul a li h4 {font-size: 19px;}
	.success ul a li p {font-size: 16px;}
	.flow ul li {font-size: 18px;}
	.safeguard p {font-size: 22px;}
	.footer h3 {font-size: 28px;}
}
@media(max-width: 500px){
	*{
		font-family: "å¾®è½¯é›…é»‘";
	}
	.banner h3 {top: 6.5%;font-size: 18px;}
	.banner h3 span {font-size: 20px !important;padding-right: 4%;padding-left: 6%;}
	.banner p {top: 37%;font-size: 19px;}
	.banner ul li h2 {font-size: 19px;}
	h1 {font-size: 24px;}
	#perplex-t-l,#perplex-t-r,#choice-t-l,#choice-t-r,#major-t-l,#major-t-r {margin-top: 3%;}
	.perplex-con-1, .perplex-con-2 {bottom: 43%;font-size: 15px;}
	.perplex-con-2 {bottom: 5%;}
	.crisis ul li h4 {font-size: 18px;}
	.crisis ul li p {font-size: 14px;}
	.crisis h2 {font-size: 19px;}
	.crisis h2 span {font-size: 24px;}
	#crisis-pro {font-size: 15.6px;}
	.about ul li {width: 32%;}
	.about ul li:nth-child(2) {padding: 0 2%;}
	.about ul li h6 {font-size: 12px;}
	.about ul li span {font-size: 14px;}
	.about div {top: 3%;}
	.about h5 {
	    top: 36%;
	    font-size: 16px;left:0;right:0;margin:auto;text-align: center;
	}
	.about p {font-size: 16px;top:8%}
	.skilled div h4 {font-size: 17px;}
	.skilled ul li h5 {font-size: 20px;}
	.skilled ul li h5 span {font-size: 24px;padding-right: 6px;}
	.skilled ul li p {font-size: 16px;padding: 5px 0 15px 0;}
	.skilled aside span {font-size: 20px;}
	.choice p {font-size: 17px;}
	.choice ul li span {font-size: 22px;}
	.choice ul li {font-size: 16px;}
	.major ul li h3 {font-size: 16px;}
	.major ul li p {font-size: 14px;}
	.section p {font-size: 16px;}
	.section p span {font-size: 18px;}
	.feedback p {font-size: 16px;}
	.feedback h4 {font-size: 18px;}
	.success ul a li h4 {font-size: 18px;}
	.flow ul li {font-size: 16px;}
	.safeguard p {bottom: 19%;font-size: 19px;}
	.safeguard p span {font-size: 26px;}
	.footer h3 {font-size: 24px;padding: 8px 0;}
	.footer h6 {font-size: 18px;}
	.footer div {font-size: 14px;}
	.bottomwx a {font-size: 20px;}
	.popup {width: 80%;}
	.popup p {bottom: 26.5%;}
	#popup-wechat {bottom: 8%;}
}
@media(max-width: 460px){
	.banner h3 {font-size: 16px;}
	.banner h3 span {font-size: 18px !important;}
	.banner p {font-size: 18px;}
	.banner ul li h2 {font-size: 18px;padding:0}
	.banner ul li h6 {font-size: 14px;}
	h1 {font-size: 20px;}
	#perplex-t-l, #perplex-t-r,#flow-t-l,#flow-t-r,#safeguard-t-l,#safeguard-t-r,#feedback-t-l,#feedback-t-r,#success-t-l,#success-t-r,#major-t-l,#major-t-r,#choice-t-l,#choice-t-r,#skilled-t-l,#skilled-t-r  {margin-top: 2%;}
	.perplex-con-1, .perplex-con-2 {font-size: 14px;}
	.crisis ul li h4 {font-size: 16px;}
	.crisis ul li h4 {font-size: 16px;padding-bottom: 15%;}
	.crisis h2 span {font-size: 20px;}
	.crisis h2 {font-size: 18px;}
	#crisis-pro {font-size: 14.5px;}
	.about p {font-size: 15px;}
	.about img {height: 490px;}
	#about-t-l,#about-t-r {margin-top: 3%;height: auto;}
	.about ul {bottom: auto;top:60%;}
	.skilled div h4 {font-size: 16px;}
	.skilled ul li h5 span {font-size: 20px;}
	.skilled ul li h5 {font-size: 18px;}
	.skilled ul li p {font-size: 15px;padding: 5px 0 12px 0;}
	.skilled ul li {margin-bottom: 6px;}
	.skilled aside span {top: 5px;font-size: 18px;}
	.choice p {font-size: 16px;}
	.choice ul li span {font-size: 19.5px;}
	.section p span {font-size: 17px;}
	.success ul a li p {font-size: 14px;}
	.success ul a li h4 {font-size: 16px;}
	.success ul a li {padding: 10px 0;}
	.feedback h4 {font-size: 16px;}
	.feedback p {font-size: 16px;}
	.flow ul li {font-size: 12px;}
	.safeguard p {font-size: 16px;}
	.safeguard p span {font-size: 22px;}
	.footer h3 {font-size: 22px;}
}
@media(max-width: 440px){
	.banner h3 span {font-size: 15px !important;}
	.banner h3 {top: 7%;font-size: 14px;}
	.banner p {font-size: 15px;}
	.banner ul li h6 {font-size: 13px;}
	.banner ul li h2 {font-size: 15px;}
	h1 {font-size: 20px;}
	#about-t-l, #about-t-r,#perplex-t-l, #perplex-t-r,#flow-t-l,#flow-t-r,#safeguard-t-l,#safeguard-t-r,#feedback-t-l,#feedback-t-r,#success-t-l,#success-t-r,#major-t-l,#major-t-r,#choice-t-l,#choice-t-r,#skilled-t-l,#skilled-t-r  {margin-top: 0%;}
	.perplex-con-1, .perplex-con-2 {font-size: 14px;}
	.crisis ul li h4 {font-size: 15px;}
	.crisis ul li p {font-size: 13px;}
	.crisis h2 {font-size: 16px;}
	.crisis h2 span {font-size: 18px;}
	#crisis-pro {font-size: 14.1px;}
	.about p {font-size: 15px;}
	.about h5 {font-size: 16px;}
	.skilled div h4 {font-size: 15px;}
	.skilled ul li h5 {font-size: 17px;}
	.skilled ul li h5 span {font-size: 18px;}
	.skilled ul li p {font-size: 15px;    width: 97%;}
	.skilled aside span {font-size: 15px;}
	.choice ul li {font-size: 14px;}
	.choice ul li span {font-size: 17.5px;}
	.choice p {font-size: 15px;}
	.choice h4 {top: 48%;font-size: 18px;}
	.major ul li h3 {font-size: 14px;}
	.major ul li p {font-size: 13px;}
	.major ul {top: 37%;}
	.major ul:nth-child(4) {top: 79.5%;}
	.section p {font-size: 16px;padding: 8px 0 0px 0;}
	.section p span {font-size: 16px;}
	.feedback h4 {font-size: 17px;}
	.success ul a li h4 {font-size: 15px;}
	.safeguard p {font-size: 16px;}
	.safeguard p span {font-size: 20px;}
	.footer h3 {font-size: 20px;    padding: 2px 0;}
	.footer div {font-size: 12px;}
	.bottomwx a {font-size: 17px;}
}
@media(max-width: 375px){
	.choice ul li span {font-size: 15px;}
	.choice ul li {font-size: 12px;    margin-bottom: 1.4%;}
	h1 {font-size: 15px;}
}

