﻿/* ========== */
/* = BANNER = */
/* ========== */
.banner img{ width: 100%;}


/* ========== */
/* = HOME-POINT = */
/* ========== */
.home-point{ width: 100%; height: 250px; background:url(../image/home_point_bg.png) center bottom no-repeat #FFFFFF;}
.home-point ul{ padding-left:3%; height: 168px; display: flex; flex-flow: row inwrap; justify-content: space-between;}
.home-point li{ display: inline-block; padding: 0 10px;}
.home-point li span{ display: block; padding-left: 40px; font-size: 36px; line-height: 36px; color: #be0000; font-weight: bold;}
.home-point li p{ margin-top: 10px; position: relative; padding-left: 40px; line-height: 24px; font-size: 12px;}
.home-point li p i{ position: absolute; top:0; left:0; width: 26px; height: 26px; border-radius:100%; border: 1px dashed #be0000; -webkit-animation: ripple 1s ease-out infinite; animation: ripple 1s ease-out infinite;}
.home-point li p i:before{ content: ""; position: absolute; top:7px; left:7px; width:10px; height: 10px; border-radius:100%; background:#be0000;}
.home-point li:nth-child(1){ padding-top: 15px;}
.home-point li:nth-child(2){ padding-top: 20px;}
.home-point li:nth-child(3){ padding-top: 5px;}
.home-point li:nth-child(4){ padding-top: 10px;}
.home-point .text{ color: #FFFFFF;}
.home-point .text .tit{ float: left; }
.home-point .text .tit span{ display: block; font-size: 30px; line-height:40px; color: #FFFFFF;}
.home-point .text .tit p{ margin-top:5px; font-size: 16px;}
.home-point .text .con{ margin-left: 205px; position: relative; padding-top:15px; padding-left: 30px; font-size: 14px; line-height: 26px;}
.home-point .text .con:before{ content: ""; position: absolute; top:22px; left:0; width: 1px; height: 40px; background: #FFFFFF; opacity: .6;}


@-webkit-keyframes ripple{
	0%{
		-webkit-transform:scale(1);
	}
	50%{
		-webkit-transform:scale(1.1)
	}
	100%{
		-webkit-transform:scale(1);
	}
}
@keyframes ripple{
	0%{
		transform:scale(1);
	}
	50%{
		transform:scale(1.1)
	}
	100%{
		transform:scale(1);
	}
}


 

/* ========== */
/* = home-tit = */
/* ========== */
.home-tit{ position: relative;}
.home-tit span{ display: block; font-weight: bold; font-size: 22px; line-height:38px; color: #333333;}
.home-tit h2{ margin-top:15px; font-weight: bold; font-size: 44px; line-height:52px; color: #be0000;}
.home-tit .des{ margin-top: 5px; font-size: 20px; line-height: 36px; color: #be0000;}
.home-tit .tip{ margin-top: 20px; max-width: 495px; font-size: 14px; line-height: 22px; color: #666666; }
.home-tit .more{ position: absolute; bottom: 10px; right: 0;}


/* ========== */
/* = HOME-WHAT = */
/* ========== */
.home-bg-01{ background-image: url(../image/home_bg_01.jpg); background-size: cover; }
.home-what{ padding-top: 110px ; position: relative;}
.home-what .home-tit{ position: relative; z-index:1}
.home-what .w1340{ padding-bottom: 90px; position: relative;}
.home-what .w1340:after{ content: ""; position: absolute; z-index: 0; bottom:0; right:-2.5%; height:68%; width:200%; background:#FFFFFF; -o-box-shadow:0 0 30px rgba(0,0,0,.05); -ms-box-shadow:0 0 30px rgba(0,0,.05); -moz-box-shadow:0 0 30px rgba(0,0,0,.05);  -webkit-box-shadow:0 0 30px rgba(0,0,0,.05); box-shadow:0 0 30px rgba(0,0,0,.05); }
.home-what-ul{ margin: 60px -15px 0; position: relative; z-index: 1;}
.home-what .link{ margin-top: 70px; position: relative; z-index: 1; line-height: 60px; background: #f8f8f8; padding-left: 190px;}
.home-what .link span{ position: absolute; top:0; left:0; background: #1455b7; color:#FFFFFF; width: 190px; height: 60px; line-height: 60px; text-align: center;}
.home-what .link span a{ display: block; color: #FFFFFF;}
.home-what .link>a{ display:inline-block; margin-left: 50px; position: relative; padding-left: 15px; color: #333333; }
.home-what .link>a:hover{ color:#777777;}
.home-what .link>a:before{ content: ""; position: absolute; top:50%; margin-top:-2px; left:0; width: 4px; height: 4px; background: #1455b7; border-radius: 100%;}


/* ========== */
/* = HOME-HOW = */
/* ========== */
.home-how{ padding: 125px 0 150px; position: relative;}
.home-how .img{ position: absolute; top:190px; right:0; width: 53%; height: 580px; background: url(../image/home_how_img1.jpg); background-position: center;}
.home-how .content{ margin-top: 55px; background: #FFFFFF; padding:120px 6% 130px; border-bottom: 5px solid #b30d0d;}
.home-how li{ margin-top: 60px;}
.home-how li:first-child{ margin-top: 0;}
.home-how li a{ display:block;}
.home-how li img{ float: left; margin: 0;}
.home-how li div{ margin-left: 115px; padding-top:10px;}
.home-how li div span{ display: block; font-size: 24px; color: #222222;}
.home-how li div p{ margin-top: 10px; font-size: 14px; color: #666666; font-style:italic;}
.home-how li a:hover span{ color: #b30d0d;}
.home-how li a:hover p{ color: #b30d0d;}


/* ========== */
/* = HOME-SOLUTION = */
/* ========== */
.home-solution{ padding: 120px 0 170px; background-image: url(../image/home_solution_bg.jpg); background-size: cover; background-attachment: fixed;}
.home-solution .home-tit span{ color: #FFFFFF;}
.home-solution .home-tit h2{ color: #FFFFFF;}
.home-solution .home-tit .des{ color: #FFFFFF;}
.home-solution .home-tit .tip{ color:rgba(255,255,255,.6);}
.home-solution .content{ position: relative;}
.home-solution .home-tit{ position: absolute; top:0; left:0;}
.home-solution ul{ margin: 0 -14px; padding-top: 30px;}
.home-solution li{ float: left; width: 20%; padding:14px; text-align: center;}
.home-solution li:nth-child(5n+1){ clear: both;}
.home-solution li .item{ display: block; border: 1px solid rgba(255,255,255,.2); padding: 30px 10px 40px;}
.home-solution li .item p{ margin-top: 10px; color:#EEEEEE; }
.home-solution li .item:hover{ background: #b20000;}
.home-solution li .item:hover img{ animation: tada 1s; -webkit-animation: tada 1s;}


/* ========== */
/* = HOME-SERVICE = */
/* ========== */
.home-bg-02{ background-image: url(../image/home_bg_02.jpg); background-size: cover; }
.home-service{ padding-top: 110px;}
.home-service .content{ margin-top: 50px; background:#FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.home-service .img{ width: 42%; position: relative; z-index: 0;}
.home-service .img:after{ content: ""; position: absolute; top:10%; right:12%; width: 140%; height: 100%; background: #b20000; z-index:0;}
.home-service .img img{ position: relative; z-index: 1;}
.home-service .right{ width: 58%; padding:20px 7%; position: relative; z-index:1;}
.home-service .tit{ font-size: 26px; color: #1455b7;  background: url(../image/ico_blue_cricle.png) no-repeat left; padding-left: 35px; position: relative;}
.home-service .tit:before{ content: ""; position: absolute; left:-140px; top:50%; width: 120px; height: 1px; background: #1455b7;}
.home-service .right .des{ margin-top: 25px; font-size:17px; color: #333333; line-height: 30px;}
.home-service .point{ margin-top: 20px; padding-bottom: 50px; border-bottom: 1px dashed #dcdcdc;}
.home-service .point li{ margin-top: 10px; float: left; width: 50%; }
.home-service .point li:nth-child(2n+1){ clear: both;}
.home-service .point li div{ display:inline-block; background:url(../image/ico_right.png) no-repeat left 3px; padding-left: 30px; line-height:24px; font-size: 12px;}
.home-service .text li{ margin-top: 45px; float: left; width: 33.33333333333333%;}
.home-service .text li:nth-child(2){ width:66%;}
.home-service .text li:nth-child(3){ clear: both;}
.home-service .text li img{ float: left;}
.home-service .text li div{ margin-left: 55px;}
.home-service .text li div span{ display:block; font-size: 32px; line-height: 40px; color: #333333;}
.home-service .text li div p{ margin-top: 5px; max-width: 140px; font-size: 12px; color: #999999; line-height: 18px;}


/* ========== */
/* = HOME-CHOOSE = */
/* ========== */
.home-choose{ margin-top: 180px;}
.home-choose .content{ margin-top: 45px; padding-bottom:70px; position: relative;}
.home-choose .content:after{ z-index: 0; content: ""; position: absolute; z-index: 0; top:0; left:-7%; height:100%; width:200%; background:#FFFFFF; -o-box-shadow:0 0 30px rgba(0,0,0,.05); -ms-box-shadow:0 0 30px rgba(0,0,.05); -moz-box-shadow:0 0 30px rgba(0,0,0,.05);  -webkit-box-shadow:0 0 30px rgba(0,0,0,.05); box-shadow:0 0 30px rgba(0,0,0,.05); }
.home-choose .content:before{ z-index: 1; content: ""; position: absolute; bottom:0; left:-5%; width:110%; height: 5px; background: #b30d0d;}
.home-choose-ul{ position: relative; z-index: 1; padding-top: 65px; margin: 0 -8px;}
.home-choose-ul li{ float: left; width: 16.666666667%; padding: 8px;}
.home-choose-ul li .item{ display: block; border: 1px solid #e5e5e5; position: relative; overflow:hidden;}
.home-choose-ul li .item div{ display: none; position: absolute; top:0; left:0; width: 100%; height: 100%; background: rgba(0,72,181,.8); color: #FFFFFF;}
.home-choose-ul li .item div span{ position: absolute; top:50%; left:0; width: 100%; text-align: center; font-size:48px; line-height: 48px; color: #FFFFFF; margin-top:-24px;}
.home-choose-ul li .item:hover img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.home-choose-ul li .item:hover div{ display: block;}

.home-choose .scroll-content{  position: relative; z-index: 1; overflow: hidden; padding-bottom: 20px;}
.home-choose .slick{margin: 0 -24%;}
.home-choose .slick-slide{ padding:40px 25px;}
.home-choose .slick-slide .item{ display: block; padding: 35px 40px 22px; text-align: center; opacity: .4;}
.home-choose .slick-slide .item .img{ margin: 0 auto; width: 56px; height: 56px; border-radius: 100%; overflow: hidden; width: 56px;}
.home-choose .slick-slide .item h2{ margin-top:5px; font-size: 20px; color: #333333; font-weight:bold;}
.home-choose .slick-slide .item .text{ margin-top: 15px; font-size: 14px; line-height: 26px; color: #666666; min-height: 78px;}
.home-choose .slick-current .item{
	opacity: 1;
	-o-box-shadow:0 0 35px rgba(0,0,0,.08); 
	-ms-box-shadow:0 0 35px rgba(0,0,.08); 
	-moz-box-shadow:0 0 35px rgba(0,0,0,.08);  
	-webkit-box-shadow:0 0 35px rgba(0,0,0,.08); 
	box-shadow:0 0 35px rgba(0,0,0,.08); 
}
.home-choose .slick-prev{ left:33.333333%;}
.home-choose .slick-next{ right: 33.333333%;}
.home-choose .slick-dots{ bottom: -20px;}
.home-choose .slick-dots li { width: 18px; height: 18px; padding:5px; margin: 0 5px; border:1px solid rgba(255,255,255,0); border-radius: 50%;}
.slick-dots li button { background: #1455b7; width: 6px; height: 6px; }
.slick-dots li.slick-active { border:1px solid #1455b7;}
.slick-dots li.slick-active button { background: #1455b7;}




/* ========== */
/* = HOME-NEWS = */
/* ========== */
.home-news{ padding:100px 0 190px;}
.home-news .tab{ margin-top: 30px;}
.home-news .tab span{ margin-right: 10px; display: inline-block; color: #333333; width: 120px; height: 40px; line-height: 40px; background: #dcdcdc; text-align: center; font-size: 14px; font-weight: normal; cursor: pointer;}
.home-news .tab span.active{ background: #1455b7; color:#FFFFFF;}
.home-news .js-tab-box{ position: relative;}
.home-news .js-tab-box:after{ content: ""; position: absolute; z-index: 0; top:12%; right:-5%; height:108%; width:200%; background:#FFFFFF; -o-box-shadow:0 0 30px rgba(0,0,0,.05); -ms-box-shadow:0 0 30px rgba(0,0,.05); -moz-box-shadow:0 0 30px rgba(0,0,0,.05);  -webkit-box-shadow:0 0 30px rgba(0,0,0,.05); box-shadow:0 0 30px rgba(0,0,0,.05);}
.home-news .js-tab-con{ display: none; position: relative; z-index: 1;}
.home-news .js-tab-con.active{ display: block;}
.home-news-ul{ margin:50px -18px 0; position: relative;}
.home-news-ul li{ position: relative; z-index: 1; float: left; width: 33.33333333%; padding: 0 18px;}
.home-news-ul li a{ display: block;}
.home-news-ul li .img{ position: relative; overflow: hidden;}
.home-news-ul li .img:after{ display: none; content:""; position: absolute; top:0; left:0; width: 100%; height: 100%; border: 5px solid #a31818;}
.home-news-ul li span{ margin-top: 30px; display: block; font-size: 18px; color: #333333;min-height: 75px;}
.home-news-ul li p{ margin-top: 10px; line-height: 24px; height: 48px; overflow:hidden; color: #999999;} 
.home-news-ul li i{  display: block; margin-top: 25px; line-height: 24px; font-style: normal; color: #be0000; font-weight: bold; padding-bottom: 30px; border-bottom:2px solid #eeeeee; position: relative;}
.home-news-ul li i em{ display: none; position: absolute;top:0; right:0; font-size: 20px; font-weight: bold;}
.home-news-ul li a:hover .img:after{ display: block;}
.home-news-ul li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.home-news-ul li a:hover i em{ display: block;}
.home-news-ul li a:hover i{ border-bottom:2px solid #be0000;}


.home-faq-ul{ margin-top: 30px;}
.home-faq-ul li{ margin-top:30px; float: left; width: 49%; margin-right: 2%; background: #FFFFFF; padding: 45px 70px 45px 170px; position: relative;}
.home-faq-ul li:nth-child(2n){ margin-right: 0;}
.home-faq-ul li:before{ content: ""; position: absolute; top:50%; left:60px; margin-top:-14px;  width: 30px; height: 27px; background: url(../image/ico_faq.png);}
.home-faq-ul li .ques{ font-size: 16px; color: #333333; line-height: 26px; padding-left: 20px; position: relative;}
.home-faq-ul li .ques:before{ content: ""; position: absolute; top:50%; margin-top: -7px; left:0; width: 4px; height: 14px; background: #b40d0d;}
.home-faq-ul li .ans{ margin-top: 25px; line-height: 26px; height: 52px; overflow: hidden; padding-left: 20px; text-align: justify;}



@media (max-width:1540px) {
	
	/* ========== */
	/* = home-tit = */
	/* ========== */
	.home-tit span{ font-size: 20px;}
	.home-tit h2{font-size: 36px; }
	.home-tit .tip{ max-width: 40%; }
	
	/* ========== */
	/* = HOME-WHAT = */
	/* ========== */
	.home-what .link{ padding-left: 150px;}
	.home-what .link span{ width: 150px;}
	.home-what .link>a{ margin-left:30px; padding-left: 20px;}
	
	
	/* ========== */
	/* = HOME-SERVICE = */
	/* ========== */
	.home-service .right{ padding:20px 50px;}
	.home-service .tit{ font-size: 22px;}
	.home-service .right .des{ margin-top:15px; font-size:14px; line-height: 24px;}
	.home-service .point{ margin-top:15px; padding-bottom: 30px; }
	.home-service .text li{ margin-top: 25px;}
	.home-service .text li div{ margin-left: 45px;}
	.home-service .text li div span{ font-size:22px; ;}

}