@charset "utf-8";
/* CSS Document */
/*共用代码 */
html{ font-size:calc(100vw/6.4);}
@media screen and (min-width:640px){html{ font-size:100px;}}
body {font-family:微软雅黑;}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	list-style-type: none;
}
li,ul,ol{ list-style:none}
a{ text-decoration:none}
i,em{ font-style:normal;}
.pr{ position: relative}
img{width: 100%;}
.fl{ float: left}
.fr{ float: right}
.ov{ overflow:hidden}
.clear{ clear: both;overflow: initial;}
.tc{ text-align: center}

input{ outline: none}

.col-w{ color: #fff}

.pat30{ padding-top: 0.3rem}
.patb20{ padding: 0.2rem 0}
.patb30{ padding: 0.3rem 0}
.patb40{ padding: 0.4rem 0}

.wi{max-width:640px; min-width:320px; margin: 0 auto; font-size: 0.2rem; overflow: hidden;}
.wi img{ vertical-align:bottom}

.wi .btn{ text-align: center}
.wi .btn a{ display: inline-block; padding:0.1rem 0.2rem;color: #fff; border-radius:0.5rem;
   font-size: 0.28rem;background: #859ff0;
    animation: heartBeat 2s infinite; -webkit-animation: heartBeat 2s infinite;
    background: -webkit-linear-gradient(top, #859ff0, #cb6afe);
    background: -o-linear-gradient(bottom, #859ff0, #cb6afe);
    background: -moz-linear-gradient(bottom, #859ff0, #cb6afe);
    background: linear-gradient(to bottom,#859ff0, #cb6afe);
    animation: heartBeat 2s infinite; -webkit-animation: heartBeat 2s infinite
}
.wi .btn a:nth-child(even){
	background: -webkit-linear-gradient(top, #f09950, #f45f71);
    background: -o-linear-gradient(bottom, #f09950, #f45f71);
    background: -moz-linear-gradient(bottom, #f09950, #f45f71);
	background: linear-gradient(to bottom,#f09950, #f45f71);
	margin-left: 2%
}

.kv a{ display: block; width:1.28rem; position: absolute; bottom:2.4rem; right:0.43rem;
	animation: heartBeat 6s infinite; -webkit-animation: heartBeat 6s infinite
}
.kv i{ display: block; width: 4.87rem; position: absolute; left:0.78rem; bottom:0.75rem;}

.p1{ background: url(../images/p1-bg.jpg) no-repeat; background-size:cover; height:2.83rem; position: relative}
.p1 ul li{ font-size: 0.22rem; position: absolute; border-radius: 0.5rem; overflow: hidden;
	box-shadow: 0 5px 15px rgba(0,0,0,0.3)
}
.p1 ul li a{ color: #fff}
.p1 ul li::before,.p1 ul li::after{ content: ""; display:inline-block; width:0.21rem; height:0.48rem;
	background: url(../images/bf.png) no-repeat; background-size:cover; vertical-align:middle;
}
.p1 ul li::after{	background: url(../images/af.png) no-repeat; background-size:cover; }
.p1 ul li i{ display: inline-block; vertical-align:middle; height:0.48rem; line-height: 0.48rem; 
	background: url(../images/ce.png) repeat-x; background-size:1px 0.48rem; padding: 0 0.2rem}
.p1 ul li:nth-child(1){ right:0.45rem; top:0.1rem}
.p1 ul li:nth-child(2){ left:0.3rem; top:0.45rem}
.p1 ul li:nth-child(3){ right:0.3rem; top:0.9rem}
.p1 ul li:nth-child(4){ left:0.77rem; top:1.5rem}

.p2{  background: #ff8ea0}
.p2 .case {position: relative; padding: 0.1rem;}
.p2 .case ul {width: 79%; overflow: hidden;}
.p2 .case ul li {
	position: relative;
	float: left;
	width: 23%;
	margin: 1%;
}
.p2 .case ul li a img{ height:0.44rem;}
.p2 .case ul li img.icon {
	display: none;
	width: 0.21rem;
	position: absolute;
	z-index: 2;
	bottom: -25%;
}
.p2 .caseIcon {display: block !important;-webkit-animation:caseIcon  1.5s linear infinite backwards; animation:caseIcon  1.5s linear infinite backwards;}
.p2 .casepic { display: block; position: absolute;border-radius: 0.1rem; overflow: hidden;top: 12%;right: 1%;	width: 19%;}
@keyframes caseIcon{
	0%{ right: 0%;transform:scale(0.5);opacity: 0.5;}
	50%{  right: 30%;transform:scale(1);opacity: 1;} 
	100%{  right: 30%;transform:scale(1);opacity: 0;}
}
.p3 .sp3{ position: relative}
.p3 ul{ text-align: center}
.p3 ul li{ width: 30%; display: inline-block; margin-left: 2%; color: #4276dc; line-height: 0.5rem}
.p3 .arrow-left,.p3 .arrow-right{ width:0.3rem; height:1rem; background: url(../images/prev.png) no-repeat center rgba(0,0,0,0.5); 
    background-size:0.23rem 0.43rem; position: absolute; left:0; top:0; bottom:0; margin:auto 0; z-index: 2}
.p3 .arrow-right{background: url(../images/next.png) no-repeat center rgba(0,0,0,0.5); background-size:0.23rem 0.43rem; left:auto; right:0}


.hot {
	background-color: white;
	padding: 1% 2% 15% 2%;
}
.hot .pull-left{ float: left; width: 20%;}
.hot h2 {
	font-size: 0.28rem;
	line-height: 2;
	color: #3a3a3a;
	font-weight:bold;
	font-style:italic;
	padding-left: 2%;
}
.hot h2 strong{ color:#ff0028;font-size: 0.52rem;}
.hot h2 span{ color:#ff0028;}
.hot img{
	margin:0 2% 0 0;
	animation:hotimg 1s infinite;
	-webkit-animation:hotimg 1s infinite;
}
.hot .db {
	width: 76%;
	border-left:2px solid #000;
	padding-left: 2%;
	float: right;
}
.hot aside .db a {
	display: block;
	float: left;
	width: 50%;
	font-size: 0.2rem;
	line-height: 1.7;
	text-decoration:underline;
	color: #575656
}
.answer {padding-bottom: 20%;background: #ededed;}
.leftd{ overflow: hidden; padding: 5% 5% 0}
.leftd_h{
	width: 0.79rem;
	border-radius: 50%;
	display: block;
	float: left;
	overflow: hidden;
}
.speech {
	float: left;
	padding: 0.2rem;
	border-radius: 8px;
	font-size:0.22rem;
	margin-left: 5%;
	position: relative;
	background: #a8e67c;
	width: 70%
}
.speech:before,.speech:after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	top: -0.64rem;
	border: 8px solid;
	left: -8px;
	border-width: 8px 9px 8px 0;
	border-color: transparent #a8e67c;
}
.speech:before {
    left: -0.08rem;
    top: 0.2rem;
}
.speech:after {
	left: 0.68rem;
	top: -0.64rem;
	border: 8px solid;
	border-color: transparent transparent #a8e67c transparent;
}
.speech i{ display: inline-block; width:0.28rem}

.sendMsg {
	bottom: 0;
	background-color: white;
	font-size: 0.22rem;
	padding: 2% 0;
}
.sendMsg img {
	width: 5%;
	margin: 0 3%;
	display: inline-block;
	vertical-align: middle;
}
.sendMsg input {
	border: 1px solid #b9b9b9;
	width: 60%;
	display: inline-block;
	vertical-align: middle;
	border-radius:0.05rem;
	line-height: 2.5;
	padding-left: 2%;
	font-size: 0.2rem;
}
.sendMsg a {
	float: right;
	color: white;
	border-radius: 6px;
	line-height: 2.5;
	width: 21%;
	text-align: center;
	background-color: #68bd3e;
}

.p4 .btn{ position: absolute; bottom:0.6rem; left:0; width: 100%;
	-webkit-box-sizing: border-box
}

.p5{ background: #ff8ea0}
.p5 ul{ text-align: center; overflow: hidden;}
.p5 ul li{ width:2.95rem; height:0.67rem; display: inline-block; font-size: 0.24rem; line-height: 0.6rem;
	background: url(../images/p5-ico.png) no-repeat; background-size:cover; text-align: center; margin-bottom: 0.3rem }
.p5 ul li a{ color: #000}
.p5 ul li:nth-child(even){ margin-left: 2%}

.wi .pagination {width: 100%; text-align: center;}
.wi .swiper-pagination-switch {display: inline-block;width: 0.13rem;height: 0.13rem;border-radius: 50%;
	margin: 0 0.05rem;cursor: pointer; background: #ababac}
.wi .swiper-active-switch {background: #fc5a97; width: 0.4rem; border-radius: 0.1rem}

@keyframes dong{
	0%,20%,50%,80%,100%{
		-webkit-transform: scale(1);
		transform: scale(1);
	}
	40%{
		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}
	60%{
		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}
}
@keyframes hotimg{
	0%,20%,50%,80%,100%{
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
	40%{
		-webkit-transform: translateX(2px);
		transform: translateX(2px);
	}
	60%{
		-webkit-transform: translateX(-4px);
		transform: translateX(-4px);
	}
}


@-webkit-keyframes heartBeat{0%{-webkit-transform:scale(1);transform:scale(1)}14%{-webkit-transform:scale(0.9);transform:scale(0.9)}28%{-webkit-transform:scale(1);transform:scale(1)}42%{-webkit-transform:scale(0.9);transform:scale(0.9)}70%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes heartBeat{0%{-webkit-transform:scale(1);transform:scale(1)}14%{-webkit-transform:scale(0.9);transform:scale(0.9)}28%{-webkit-transform:scale(1);transform:scale(1)}42%{-webkit-transform:scale(0.9);transform:scale(0.9)}70%{-webkit-transform:scale(1);transform:scale(1)}}