.wp { max-width: 640px; min-width: 320px; margin: 0 auto; font-size: 18px; color: #000000; line-height: 1.7; }
.banner { width: 100%; }
.banner img { width: 100%; }
.btn { color: #fff; background: #c50ee6; width: 70%; display: block; margin: 5% auto; text-align: center; font-size: 1rem; border-radius: 30px; line-height: 2.5; }
.btn span { color: #ffff00; font-weight: bold; }
.d1, .d2, .d3 { display: block; width: 50%; height: 50%; border-radius: 50%; background-color: #ff9600; position: absolute; left: 50%; margin-left: -25%; top: 50%; margin-top: -25%; z-index: 55; }
.btn2 .d1, .btn2 .d2, .btn2 .d3 { background-color: #09b7b7; }
.d1 { -webkit-animation: kuosan 3s linear infinite; -moz-animation: kuosan 3s linear infinite; animation: kuosan 3s linear infinite; }
.d2 { -webkit-animation: kuosan 3s linear 0.8s infinite; -moz-animation: kuosan 3s linear 0.8s infinite; animation: kuosan 3s linear0.8s infinite; }
.d3 { -webkit-animation: kuosan 3s linear 1.6s infinite; -moz-animation: kuosan 3s linear 1.6s infinite; animation: kuosan 3s linear1.6s infinite; }
@-webkit-keyframes kuosan {
	from { opacity: 1; -webkit-transform: scale(0) translate3d(0, 0, 0) }
	to { opacity: 0; -webkit-transform: scale(4) translate3d(0, 0, 0) }
}
@-moz-keyframes kuosan {
	from { opacity: 1; -moz-transform: scale(0) translate3d(0, 0, 0) }
	to { opacity: 0; -moz-transform: scale(4) translate3d(0, 0, 0) }
}
@-o-keyframes kuosan {
	from { opacity: 1; -o-transform: scale(0) translate3d(0, 0, 0) }
	to { opacity: 0; -o-transform: scale(4) translate3d(0, 0, 0) }
}
@keyframes kuosan {
	from { opacity: 1; transform: scale(0) translate3d(0, 0, 0) }
	to { opacity: 0; transform: scale(4) translate3d(0, 0, 0) }
}
.text { font-family: "arial"; text-transform: uppercase; margin: 5% auto; width: 95%; font-family: "Microsoft Yahei"; }
.text h2 { line-height: 1.5; font-size: 1.2rem; color: #000; font-weight: 500; }
.text p { font-size: 0.9rem; color: #333333; line-height: 1.5; margin-bottom: 5%; border-bottom: 1px dashed #999999; padding-bottom: 5%; }
.hd { height: 30px; margin: 0 auto; }
.hd li { width: 10px; height: 10px; border-radius: 10px; background: #ccc; float: left; margin: 10px 5px; }
.hd .on { width: 10px; height: 10px; border-radius: 10px; background: #b0f; }
.w30 { width: 60px; }
.w40 { width: 80px; }
.w50 { width: 100px; }
.w60 { width: 120px; }
.wp .section1 { width: 100%; overflow: hidden; }
.wp .section1 .area {width: 100%;/* padding: 0 5%; */}
.wp .section1 .area ul {/* width: 90%; *//* padding: 0 5%; */}
.wp .section1 .area li {width: 46%;float: left;margin: 0 2% 2% 2%;}
.wp .section1 .area li .box { background: #f2f2f2; padding-bottom: 5%; margin-bottom: 5%; }
.wp .section1 .area li .box p { font-size: 0.75rem; text-align: center; line-height: 1.5; padding: 5% 0; }
.wp .section1 .area li .box .btn { margin-top: 0; line-height: 2; border-radius: 30px; }
.wp .section2 { width: 100%; overflow: hidden; }
.wp .section2 .text h3 { font-size: 0.75rem; font-weight: normal; }
.wp .section2 .area { width: 100%; overflow: hidden; }
.wp .section2 .area ul { width: 95%; margin: 0 auto; overflow: hidden; }
.wp .section2 .area li { width: 45%; float: left; background: #f2f2f2; margin: 0px 5% 5% 0; }
.wp .section2 .area h3 { color: #333333; font-weight: normal; font-size: 1rem; }
.wp .section2 .area .btn { width: 50%; line-height: 3; border-radius: 30px; margin-top: 2%; }
.wp .section2 .area .box { width: 100%; position: relative; }
.wp .section2 .area .box .btn { line-height: 2.5; border-radius: 30px; position: absolute; right: 17%; bottom: 0; width: 40%; }
.wp .section3 { width: 100%; overflow: hidden; }
.wp .section3 .text h2 { margin-bottom: 3%; }
.wp .section3 .area { width: 95%; margin: 0 auto; }
.wp .section3 .area ul { overflow: hidden; }
.wp .section3 .area li { position: relative; }
.wp .section3 .area li .btn { position: absolute; bottom: 2%; width: 45%; right: 25%; margin: 0; line-height: 2; }
.wp .section3 .area .li3 .btn { bottom: 4%; }
.wp .section3 .area .li4 .btn { bottom: 0; width: 60%; right: 15%; }
.wp .section4 .area { width: 90%; margin: 0 auto; }
#bd { margin: 0 auto; width: 80%; }
#bd .bd { margin: 0 auto; }
#bd .bd li { margin: 0 auto; }
.wp .section4 .area .btn { width: 60%; }
.wp .section5 { width: 100%; overflow: hidden; }
.wp .section5 .area { width: 95%; margin: 0 auto; }
.wp .section5 .area ul { overflow: hidden; }
.wp .section5 .area li { width: 48%; margin: 0 4% 4% 0; float: left; }
.wp .section5 .area li .box { background: #f2f2f2; padding: 0 5%; }
.wp .section5 .area li .box h3 { font-weight: normal; line-height: 2; padding-top: 3%; border-bottom: 1px dashed #929292; width: 100%; margin: 0 auto; font-size: 1rem; line-height: 2; }
.wp .section5 .area li .box p {color: #666666;font-size: 0.8rem;margin-top: 7%;padding-bottom: 10%;line-height: 1.5;}
.wp .section5 .area .btn { width: 60%; }
.wp .section6 { width: 100%; overflow: hidden; }
.wp .section6 .area { width: 100%; }
.wp .section6 .area p { position: absolute; bottom: 8%; font-size: 0.8rem; width: 80%; left: 8%; }
.wp .section7 { width: 100%; overflow: hidden; }
.wp .section7 .area { width: 95%; margin: 0 auto; }
.wp .section7 .area ul { overflow: hidden; margin-bottom: 5%; }
.wp .section7 .area li { margin-top: 2%; float: left; }