﻿@charset "utf-8";
/* CSS Document */
/*共用代码 */
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;
	vertical-align: baseline;
	list-style-type: none;

}

input{ outline: none; /*display: block*/}
html{ font-size:100px;}
body {font-family:微软雅黑;font-size:0.01rem;}
li,ul,ol{ list-style:none}
a{ text-decoration:none}
i,em{ font-style:normal;}
.p_pr{ position: relative}
.p_pa{ position: absolute}
body img{vertical-align: middle;width: 100%}
.p_fl{ float: left}
.p_fr{ float: right}
.p_hide{ overflow: hidden}
.normal{ font-weight: normal}
.tc{ text-align: center}
.pa15{ padding: 0.15rem}
.pa20{ padding: 0.2rem}
.patb10{ padding: 0.1rem 0}
.patb20{ padding: 0.2rem 0}
.pab20{ padding-bottom: 0.2rem }
.paLR10{ padding: 0 0.1rem}
.mr45{ margin-right: 0.45rem}
.font20{ font-size: 0.2rem}
.font22{ font-size: 0.22rem}
.font24{ font-size: 0.24rem}
.font26{ font-size: 0.26rem}
.font28{ font-size: 0.28rem}
.font30{ font-size: 0.3rem}
.font36{ font-size: 0.36rem}
.line30{ line-height: 0.3rem}
.line35{ line-height: 0.35rem}
.line40{ line-height: 0.4rem}
.bg_vio{ background: #7177c1}
.bg_vio1{ background: #8da8d5}
.col_w{ color: #fff}
.col_333{ color: #333}
.col_ccc{ color: #ccc}

.warp{ max-width: 640px; min-width: 320px; margin: 0 auto; font-size:0.2rem}

.btn a{ display: inline-block; padding: 0.1rem 0.3rem; border-radius: 0.2rem; 
	font-size: 0.3rem; color: #fff;animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite;
	background: #0fbdcb;
	background: -webkit-linear-gradient(left, #0fbdcb , #12b5e6);
	background: -o-linear-gradient(right, #0fbdcb , #12b5e6);
	background: -moz-linear-gradient(right, #0fbdcb , #12b5e6);
	background: linear-gradient(to right,#0fbdcb , #12b5e6); 
}

.banner{height: 3.37rem;overflow: hidden;}
.banner .banPage{position: absolute;left: 0;bottom: 0;}

.menu_nav ul{ padding: 0.3rem 0.05rem 0.1rem; text-align: center; overflow: hidden;}
.menu_nav ul li{width: 1.52rem; margin-bottom:5%; margin-right: 0.04rem; line-height: 0.3rem; /*display: inline-block;*/float: left;}
.menu_nav ul li.six{font-size: 0.18rem;}
.menu_nav ul li:nth-child(5n){ margin-right: 0;}
@media screen and (max-width: 340px){.menu_nav ul li{ margin-right: 0.3rem;}  }
.menu_nav ul li i{ width: 0.86rem; height: 0.86rem; display: inline-block;overflow: hidden;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	position: relative;	 }
.menu_nav ul li a{ color: #333}
.menu_nav ul li a:hover{-webkit-tap-highlight-color: transparent;}
.menu_nav ul li p{line-height: 0.35rem;}
.menu_nav ul li{animation-delay: ;}

.p1 ul li{ background: url(../images/p0-bg.jpg) no-repeat; background-size:cover; margin:5% 0; color: #171717; padding-bottom: 7%;}
.p1 ul li dl{ display: flex; display: -webkit-flex; justify-content: space-around;}
.p1 ul li dt{ width:2.36rem; margin-top:-0.2rem; position: relative;}
.p1 ul li dt i{ display: block; width:1.34rem; border-radius:50%; overflow: hidden; position: absolute; right:-0.3rem; bottom:-0.3rem}
.p1 ul li dd{ width:50%; padding:5% 0; font-size:0.22rem;}
.p1 ul li dd h3{ font-size:0.54rem;}
.p1 ul li dd em{ display: block; font-size:0.31rem;}
.p1 ul li dd p{ line-height:0.35rem;}
.p1 ul li dd p a{ color:#ff0000;}
.p1 ul li dd .btn{ display: flex; display: -webkit-flex; justify-content: space-between; padding-top:10%}
.p1 ul li dd .btn a{ width:40%; font-size:0.22rem; padding:0.1rem 4%}
.p1 ul li dd .btn a:nth-child(odd){
	background: #4db3f9;
	background: -webkit-linear-gradient(left, #4db3f9, #498ce3);
	background: -o-linear-gradient(right, #4db3f9 , #498ce3);
	background: -moz-linear-gradient(right, #4db3f9, #498ce3);
	background: linear-gradient(to right,#4db3f9, #498ce3); 
}

.p2 ul li{ padding-top:2%; position: relative;}
.p2 ul li .btn{ position: absolute; bottom:0.4rem; left:0; width:100%; text-align: center;}
.p2 .btn a{ font-size:0.25rem;}

.p3{ padding:2% 0}

.p6 .p6-pic{ padding:2% 0}

.p7 .con{ background: #4a97e9; padding-bottom:5%;}
.p7 ul { padding:5%}
.p7 ul li a{ display: flex; display: -webkit-flex; justify-content:space-between; border-bottom: 1px solid #b4d4f8; color: #fff; padding:0 2%; line-height:0.55rem;} 
.p7 ul li i{ display:inline-block; width:0.33rem; height:0.24rem; background: url(../images/hot.png) no-repeat; background-size:cover; }

.p7 ol{ padding:0 5%}
.p7 ol li { display: flex; display: -webkit-flex; justify-content: space-between; padding-bottom:5%;}
.p7 ol li i{ display: block; width:0.85rem; height:0.84rem; border-radius:50%; overflow: hidden; margin-right:5%;}
.p7 ol li p{ background: #fff; font-size:0.24rem; padding:2%; border-radius:0.1rem;flex: 1; position: relative;}
.p7 ol li p::before{ content:""; 
	position: absolute; left:-0.15rem; top:35%;
	width:0; 
    height:0; 
    border-top:0.15rem solid transparent;
    border-bottom:0.15rem solid transparent; 
    border-right:0.15rem solid #fff; 
}

.warp .pagination {
	text-align: center;
	width: 100%;
	padding: 0.1rem 0;
}
.warp .swiper-pagination-switch {
	display: inline-block;
	width: 0.18rem;
	height: 0.18rem;
	border-radius: 50%;
	background: #cacaca;
	margin: 0 0.03rem;
	cursor: pointer;
}
.warp .swiper-active-switch {
	background: #ffdc38;
}

/*******摆动*******/
@-webkit-keyframes tada {
    from {  -webkit-transform: scale3d(1, 1, 1);  transform: scale3d(1, 1, 1);  }
    10%, 20% {  -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);  transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);  }
    30%, 50%, 70%, 90% {  -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);  transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);  }
    40%, 60%, 80% {  -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);  transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);  }
    to {  -webkit-transform: scale3d(1, 1, 1);  transform: scale3d(1, 1, 1);  }
}

@keyframes tada {
    from {  -webkit-transform: scale3d(1, 1, 1);  transform: scale3d(1, 1, 1);  }
    10%, 20% {  -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);  transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);  }
    30%, 50%, 70%, 90% {  -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);  transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);  }
    40%, 60%, 80% {  -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);  transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);  }
    to {  -webkit-transform: scale3d(1, 1, 1);  transform: scale3d(1, 1, 1);  }
}

.bounce{animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite;}
.bounce1{animation: bounce 1s ; -webkit-animation: bounce 1s ;}

@keyframes bounce{
    0%,20%,53%,80%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1);transform:translateZ(0);-webkit-transform:translateZ(0);}
    40%,43%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-8px,0);-webkit-transform:translate3d(0,-8px,0);}
    70%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-4px,0);-webkit-transform:translate3d(0,-4px,0);}
    90%{transform:translate3d(0,-2px,0);-webkit-transform:translate3d(0,-2px,0);}
}
@-webkit-keyframes bounce{
    0%,20%,53%,80%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1);transform:translateZ(0);-webkit-transform:translateZ(0)}
    40%,43%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-8px,0);-webkit-transform:translate3d(0,-8px,0)}
    70%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-4px,0);-webkit-transform:translate3d(0,-4px,0)}
    90%{transform:translate3d(0,-2px,0);-webkit-transform:translate3d(0,-2px,0);}
}