﻿@charset "utf-8";
@import "page.css";

#kp{ width:100%; padding:80px 0}
#kp .img{ margin-top:50px; text-align:center}
#kp .img img{ max-width:100%}
#kp .text{ color:#878B99; text-align:center; margin-top:50px}
#kp .text i{ display:block}


#kp_gn{ width:100%; padding:80px 0; background:#f8f8f8}
#kp_gn .list{ margin-top:20px}
#kp_gn .list ul li{ float:left; width:calc((100% - 60px) / 3); margin-right:30px; text-align: center; padding:50px; margin-top:30px; background:#fff}
#kp_gn .list ul li:nth-child(3n){ margin-right:0}
#kp_gn .list ul li .icon i{ font-size:40px;color:#005bd4;}
#kp_gn .list ul li .info{ margin-top:10px}
#kp_gn .list ul li .info big{ display:block; font-size:18px}
#kp_gn .list ul li .info small{ display:block; font-size:14px; margin-top:10px; color:#878B99; line-height:26px; min-height:80px}
#kp_gn .list ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);box-shadow:0px 0px 12px 0px rgba(0,0,0,0.06);}

#kp_pt{ width:100%; padding:80px 0;}
#kp_pt .list{ margin-top:20px}
#kp_pt .list ul li{ float:left; width:calc((100% - 90px) / 4); margin-right:30px; text-align: center; padding:50px; margin-top:30px; background:#fff}
#kp_pt .list ul li:nth-child(4n){ margin-right:0}
#kp_pt .list ul li .img{ width:80px; height:80px; background:#eaecfb; border:10px solid #f7f8fe; border-radius:100%; text-align:center; line-height:60px; margin:0 auto}
#kp_pt .list ul li .img img{ height:30px;}
#kp_pt .list ul li .info{ margin-top:10px}
#kp_pt .list ul li .info big{ display:block; font-size:18px}
#kp_pt .list ul li .info small{ display:block; font-size:14px; margin-top:10px; color:#878B99; line-height:26px; min-height:80px}
#kp_pt .list ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);box-shadow:0px 0px 12px 0px rgba(0,0,0,0.06);}

#kp_ys{ width:100%; padding:80px 0; background:#f8f8f8}
#kp_ys .list{ margin-top:20px}
#kp_ys .list ul li{ float:left; width:calc((100% - 60px) / 3); margin-right:30px; padding:30px; margin-top:30px; background:#fff}
#kp_ys .list ul li:nth-child(3n){ margin-right:0}
#kp_ys .list ul li .icon i{ font-size:36px}
#kp_ys .list ul li:nth-child(1) .icon i{color:#46b1d9}
#kp_ys .list ul li:nth-child(2) .icon i{color:#e2b233}
#kp_ys .list ul li:nth-child(3) .icon i{color:#e771b1}
#kp_ys .list ul li:nth-child(4) .icon i{color:#ae82e3}
#kp_ys .list ul li:nth-child(5) .icon i{color:#e87676}
#kp_ys .list ul li:nth-child(6) .icon i{color:#e17ae2}
#kp_ys .list ul li:nth-child(7) .icon i{color:#4fc9e2}
#kp_ys .list ul li:nth-child(8) .icon i{color:#97d25c}
#kp_ys .list ul li .info{ margin-top:10px}
#kp_ys .list ul li .info big{ display:block; font-size:18px}
#kp_ys .list ul li .info small{ display:block; font-size:14px; color:#878B99; line-height:26px; margin-top:10px;height:78px;}
#kp_ys .list ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);box-shadow:0px 0px 12px 0px rgba(0,0,0,0.06);}

@media (max-width:800px){	
	#kp{padding:.8rem 0}
	#kp .img{ margin-top:.5rem}
	#kp .text{ margin-top:.5rem}
	#kp .text i{ display: inline-block}
	
	#kp_gn{ padding:.8rem 0;}
	#kp_gn .list{ margin-top:.2rem}
	#kp_gn .list ul li{ float: inherit; width:100%; margin-right:0;  padding:.3rem; margin-top:.3rem;}
	#kp_gn .list ul li .icon i{ font-size:.48rem;}
	#kp_gn .list ul li .info{ margin-top:.1rem}
	#kp_gn .list ul li .info big{ font-size:.28rem}
	#kp_gn .list ul li .info small{font-size:.24rem; margin-top:.1rem;line-height:.34rem; min-height: inherit}

	#kp_pt{ padding:.8rem 0;}
	#kp_pt .list{ margin-top:.2rem}
	#kp_pt .list ul li{ float: inherit; width:100%; margin-right:0;  padding:.3rem; margin-top:.3rem;}
	#kp_pt .list ul li .img{ width:1.5rem; height:1.5rem; background:#eaecfb; border:.2rem solid #f7f8fe; border-radius:100%; text-align:center; line-height:1.1rem; margin:0 auto}
	#kp_pt .list ul li .img img{ height:.5rem;}
	#kp_pt .list ul li .info{ margin-top:.2rem}
	#kp_pt .list ul li .info big{ font-size:.28rem}
	#kp_pt .list ul li .info small{font-size:.24rem; margin-top:.1rem;line-height:.34rem; min-height: inherit}
	
	#kp_ys{padding:.8rem 0}
	#kp_ys .list{ margin-top:.2rem}
	#kp_ys .list ul li{ float: inherit; width:100%; margin-right:0px;padding:.3rem; margin-top:.3rem}
	#kp_ys .list ul li .icon i{ font-size:.48rem}
	#kp_ys .list ul li .info{ margin-top:.1rem}
	#kp_ys .list ul li .info big{ font-size:.28rem}
	#kp_ys .list ul li .info small{font-size:.24rem; line-height:.34rem; margin-top:.1rem;height: auto;}
}