﻿@charset "utf-8";

/*
 * Author: https://github.com/happyfreelife
 * Org: http://www.68team.com
 * Date: 2017-07-25
 */

/****************************** Normalize ******************************/
*, *:before, *:after{box-sizing: border-box;}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, ul, ol, li, dl, dd, input, button, textarea, fieldset, legend, figure, menu, th, td, pre{margin:0;padding:0;}
body{min-width: 1200px;max-width: 1920px;margin: 0 auto;font-size: 12px;font-family: Arial, "Microsoft YaHei", "PingFang SC", sans-serif;color: #666;}
h1, h2, h3, h4, h5, h6{font-weight: normal;font-size: inherit;}
a{color: #999;text-decoration: none;outline: none;}
img{border: none;}
ul, ol{list-style: none;}
i, em{font-style: normal;}
input, button, select, textarea, optgroup{font: inherit;color: inherit;outline:none;}
input[type="text"], input[type="password"], input[type="search"], button, textarea{border: 1px solid #ccc;}
input[type="button"], input[type="reset"], input[type="submit"], button{border: none;cursor:pointer;}
input[type="radio"], input[type="checkbox"]{border: none;padding:0}
input::-ms-clear, input::-ms-reveal{display: none;}
button[disabled], input[disabled]{cursor:default}
button::-moz-focus-inner, input::-moz-focus-inner{padding:0;border:0}
legend{padding:0;border:0}
textarea{resize: none;}
table{border-collapse: collapse;}
td, th{padding:0}


/****************************** Global Style ******************************/
.fl{float: left;}
.fr{float: right;}
.tac{text-align: center;}
.tar{text-align: right;}
.mr0{margin-right: 0 !important;}
.bd0{border-width: 0 !important;}
.center{margin-left: auto;margin-right: auto;}
.rps{display: block;max-width: 100%;}
.upload img{max-width: 100%;}
.container{width: 1200px;margin: 0 auto;}
.container, .wrapper, .box{position: relative;}
.container:after, .wrapper:after, .box:after, .clearfix:after{content: "";display: block;clear: both;}

@font-face {
	font-family: "Fette";
	src: url("../fonts/fette-engschrift-webfont.eot");
	src: url("../fonts/fette-engschrift-webfont.eot") format("embedded-opentype"),
		 url("../fonts/fette-engschrift-webfont.woff") format("woff"),
		 url("../fonts/fette-engschrift-webfont.ttf") format("truetype"),
		 url("../fonts/fette-engschrift-webfont.svg#fette-engschriftregula") format("svg");
	font-style: normal;
	font-weight: normal;
}

body .baguetteBox-button svg{display: none;}
body .baguetteBox-button#close-button{background-position:-210px -360px;}
body .baguetteBox-button#previous-button,
body .baguetteBox-button#next-button{width: 25px;height: 50px;}
body .baguetteBox-button#previous-button{background-position:-12px -350px;left: 5%;}
body .baguetteBox-button#next-button{background-position:-62px -350px;right: 5%;}

/****************************** Icon Sprite ******************************/
.baguetteBox-button#close-button,
.baguetteBox-button#previous-button,
.baguetteBox-button#next-button,
.floater a:after,
.index-product .list .arrow a,
.progress-list .year .arrow,
.index-news li .more:before,
.product .category a:before,
.product .certificate .arrow,
.product-equipment .scene .arrow a,
.popup-scene .box .close,
.case .list a .name span:before,
.service-policy .form dl dd:before,
.service-faq ul li h3:before,
.service-faq ul li p:before,
.service-brochure .video .play,
.news .top .text a:before,
.news ul li .text span:before,
.news ul li .text a:before,
.about .responsibility .arrow,
.about .certificate .arrow,
.contact ul li:before,
.contact .hotline strong:before{background: none;background-image: url(../images/icon.png);background-repeat: no-repeat;}


/****************************** CSS3 Transition ******************************/
.header,
.floater,
.product-field .certificate .box a img,
.banner-case .thumb img,
.case .list a .name,
.case .list a .name span,
.case .list a .name span:before{-webkit-transition: all .3s;transition: all .3s;}


/****************************** Common Part ******************************/
.header{position: fixed;top: 0;left: 0;z-index: 10;width: 100%;height: 80px;background: rgba(255, 255, 255, .95);border-bottom: 1px solid #eee;}
.header.active{background: #fff;}
.header .logo{float: left;width: 98px;height: 50px;margin-top: 12px;background: url(../images/logo.png) no-repeat;}
.header ul{float: right;margin-top: 30px;}
.header ul li{position: relative;float: left;width: 130px;text-align: center;}
.header ul li:after{content: "";position: absolute;top: 5px;right: 0;height: 10px;border-left: 1px solid #ddd;}
.header ul li:last-child:after{content: none;}
.header ul li a{line-height: 20px;font-size: 14px;color: #333;letter-spacing: 1px;}
.header ul li.active a,
.header ul li a:hover,
.header span a{color: #dd1017;}
.header span{float:right;width:85px;margin-top: 30px;line-height: 21px;font-size: 12px;color:#dd1017;letter-spacing: 1px;text-align:right;background:url(../images/en.jpg) left no-repeat;margin-left:20px;font-weight:bold;}

.footer{padding-top: 70px;background: #333;}
.footer dl{float: left;width: 350px;}
.footer dl:last-child{width: 150px;}
.footer dl dt{line-height: 16px;padding-bottom: 24px;font-size: 14px;color: #eee;}
.footer dl dt:after{content: "";display: block;width: 20px;margin-top: 24px;border-bottom: 2px solid #dd1017;}
.footer dl dd,
.footer dl dd a{line-height: 28px;color: #bbb;}
.footer dl dd a:hover{color: #dd1017;}
.footer dl dd img{display: block;width: 102px;height: 102px;margin-top: 6px;border: 6px solid #fff;}
.footer .bottom{margin-top: 24px;border-top: 1px solid #666;}
.footer .bottom p{line-height: 55px;color: #bbb;}
.footer .bottom p a{color: #bbb;}
.footer .bottom p a:hover{color: #dd1017;}

.floater{position: fixed;top: 50%;right: 0;background: #2b262c;-webkit-transform: translateY(-50%);transform: translateY(-50%);width: 54px;z-index:10;}
.floater a{position: relative;display: block;height: 42px;border-bottom: 1px solid #464247;}
.floater a span{position: absolute;top: 0;left: 0;width: 120px;line-height: 41px;padding-left: 32px;color: #fff;}
.floater a:after{content: "";position: absolute;top: 0;right: 0;width: 54px;height: 41px;background-color: #2b262c;}
.floater a:nth-child(1):after{background-position: -2px -5px;}
.floater a:nth-child(2):after{background-position: -48px -5px;}
.floater a:nth-child(3):after{background-position: -98px -5px;}
.floater a:nth-child(4):after{background-position: -148px -5px;}
.floater:hover{width: 174px;}


/****************************** Page Component ******************************/
.banner-top{position: relative;overflow: hidden;}
.banner-top img{position: relative;left: 50%;display: block;margin-left: -960px;}
.banner-top h1{position: absolute;top: 198px;left: calc(50% - 600px);line-height: 40px;font-size: 42px;color: #fff;letter-spacing: 1px;}
.banner-top h1:after{content: "";display: block;width: 30px;margin-top: 28px;border-bottom: 1px solid #eee;}

.page-title{margin-top: 80px;text-align: center;text-transform: uppercase;}
.page-title .cn{display: block;line-height: 36px;font-weight: bold;font-size: 36px;color: #333;letter-spacing: 1px;}
.page-title .en{display: block;line-height: 36px;font-size: 22px;color: #ccc;letter-spacing: .5px;}

.pagination{overflow: hidden;}
.pagination a{float: left;width: 38px;line-height: 35px;margin-right: 10px;background: #eee;cursor: pointer;font-size: 14px;color: #333;text-align: center;}
.pagination a:hover,
.pagination a.active{background: #dd1017;color: #fff;}
.pagination a.side{width: 60px;}


/****************************** Index ******************************/
.banner-index{max-height: 768px;overflow: hidden;}
.banner-index img{-webkit-transition: all 3s;transition: all 3s;}
.banner-index:hover img{-webkit-transform: scale(1.1);transform: scale(1.1);}
.banner-index .tb-btn{bottom: 5%;}
.banner-index .tb-btn a{width: 12px;height: 12px;margin: 0 8px;background: none;border: 3px solid #ddd;}
.banner-index .tb-btn a.active{background: #fff;border-color: #fff;}

.index-section-title{line-height: 42px;font-weight: bold;font-size: 42px;color: #333;text-align: center;letter-spacing: 2px;}
.index-section-title:after{content: "";display: block;width: 34px;margin: 22px auto 0;border-bottom: 2px solid #dd1017;}

.index-product{padding: 75px 0 65px;background: #f5f5f5;}
.index-product .title h2{position: relative;line-height: 45px;font-weight: bold;font-size: 42px;color: #333;text-align: center;letter-spacing: 2px;}
.index-product .title p{position: relative;width: 648px;line-height: 70px;margin: -23px auto 0;border: 1px solid #ccc;border-top: none;font-size: 14px;color: #888;text-align: center;}
.index-product .title p:before,
.index-product .title p:after{content: "";position: absolute;top: 0;width: 225px;border-bottom: 1px solid #ccc;}
.index-product .title p:before{left: 0;}
.index-product .title p:after{right: 0;}
.index-product .list{margin-top: 70px;}
.index-product .list .picture{float: left;width: 720px;height: 368px;cursor:pointer;}
.index-product .list .right{float: right;width: 425px;}
.index-product .list .right h3{line-height: 40px;margin-top: -5px;font-size: 32px;color: #333;cursor:pointer;}
.index-product .list .right p{line-height: 28px;margin-top: 20px;font-size: 14px;}
.index-product .list .right a{display: block;width: 102px;line-height: 26px;margin-top: 34px;border: 1px solid #dd1017;border-radius: 14px;color: #cc171e;text-align: center;text-transform: uppercase;}
.index-product .list .right .detail{margin-top: 70px;overflow: hidden;}
.index-product .list .right .detail img{float: left;max-width: 80px;max-height: 80px;margin-right: 5px;}
.index-product .list .arrow{position: absolute;top: 0;right: 0;z-index: 2;}
.index-product .list .arrow a{float: left;width: 36px;height: 36px;margin: 0 10px;background-color: #fff;border: 1px solid #bbb;}
.index-product .list .arrow a.prev{background-position: -207px -7px;}
.index-product .list .arrow a.next{background-position: -257px -7px;}

.index-case{margin: 80px 0 65px;overflow: hidden;}
.index-case .top{width: 570px;line-height: 22px;margin: 18px auto 0;font-size: 14px;}
.index-case .number{position: relative;z-index: 1;width: 960px;margin: 50px auto 0;}
.index-case .number:after{content: "";display: block;clear: both;}
.index-case .number li{float: left;width: 200px;margin: 0 60px;text-align: center;}
.index-case .number li strong{display: block;font: 80px/60px "Fette";color: #333;}
.index-case .number li span{display: block;margin-top: 20px;font-size: 14px;}
.index-case .map{position: relative;top: -100px;width: 560px;margin: 0 0 -100px 240px;}
.index-case .map ul{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.index-case .map li{position: absolute;width: 9px;height: 9px;}
.index-case .map li i{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(221, 16, 23, .6);border-radius: 50%;}
.index-case .map li:nth-child(1){top: 154px;left: 106px;}
.index-case .map li:nth-child(2){top: 175px;left: 210px;}
.index-case .map li:nth-child(3){top: 169px;left: 347px;}
.index-case .map li:nth-child(4){top: 101px;left: 490px;}
.index-case .map li:nth-child(5){top: 140px;left: 479px;}
.index-case .map li:nth-child(6){top: 275px;left: 136px;}
.index-case .map li:nth-child(7){top: 295px;left: 272px;}
.index-case .map li:nth-child(8){top: 295px;left: 327px;}
.index-case .map li:nth-child(9){top: 288px;left: 396px;}
.index-case .map li:nth-child(10){top: 234px;left: 441px;z-index:2;}
.index-case .map li:nth-child(11){top: 258px;left: 466px;}
.index-case .map li:nth-child(12){top: 304px;left: 463px;z-index:1;}
.index-case .map li:nth-child(13){top: 370px;left: 259px;}
.index-case .map li:nth-child(14){top: 371px;left: 355px;}
.index-case .map li:nth-child(15){top: 338px;left: 425px;}
.index-case .map li:nth-child(16){top: 240px;left: 396px;}
.index-case .map li:nth-child(17){top: 425px;left: 360px;}
.index-case .map li.item{width: 20px;height: 20px;}
.index-case .map li.item i{z-index: 10;cursor: pointer;background: none;}
.index-case .map li.item i:after{content: "";position: absolute;width: 12px;height: 12px;top: 4px;left: 4px;background: rgba(221, 16, 23, .6);border-radius: 50%;}
.index-case .map li.item .circle{position: absolute;top: 50%;left: 50%;width: 80px;height: 80px;margin: -40px 0 0 -40px;border: 1px solid rgba(221, 16, 23, .8);border-radius: 50%;opacity: 0;}
.index-case .map li.item .circle:nth-child(1){-webkit-animation: ripple 4.5s ease-out .22s infinite;animation: ripple 4.5s ease-out .22s infinite;}
.index-case .map li.item .circle:nth-child(2){-webkit-animation: ripple 4.5s ease-out .9s infinite;animation: ripple 4.5s ease-out .9s infinite;}
.index-case .map li.item .circle:nth-child(3){-webkit-animation: ripple 4.5s ease-out 1.8s infinite;animation: ripple 4.5s ease-out 1.8s infinite;}
.index-case .map li:nth-child(10) .circle,
.index-case .map li:nth-child(11) .circle{width: 60px;height: 60px;margin: -30px 0 0 -30px;}
.index-case .map li .box{position: absolute;top: -80px;right: 20px;z-index: 10;width: 158px;box-shadow: 1px 1px 10px rgba(50, 50, 50, .1);opacity: 0;-webkit-transition: all .8s;transition: all .8s;}
.index-case .map li:nth-child(17) .box{top:-150px;}
.index-case .map li .box.right{right: auto;left: 20px;}
.index-case .map li .box img{display: block;width: 100%;}
.index-case .map li .box .text{padding: 8px 10px;background: #fff;}
.index-case .map li .box .text h3{line-height: 20px;font-size: 16px;color: #333;}
.index-case .map li .box .text span{display: block;display: -webkit-box;line-height: 16px;overflow: hidden;color: #999;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.index-case .map li.active .box{opacity: 1;-webkit-transform: translate3d(-30px, 0, 0);transform: translate3d(-30px, 0, 0);}
.index-case .map li.active .box.right{-webkit-transform: translate3d(30px, 0, 0);transform: translate3d(30px, 0, 0);}


.index-case .more{display: block;width: 114px;line-height: 34px;margin: 0 auto;background: #dd1017;border-radius: 3px;color: #fff;text-align: center;}

.index-about-profile{height: 700px;background: url(../images/bg-index-about-profile.jpg) no-repeat center top;}
.index-about-profile .box{width: 640px;height: 700px;padding: 95px 45px 0;background: rgba(221, 16, 23, .95);}
.index-about-profile .box h2{line-height: 45px;font-weight: bold;font-size: 42px;color: #fff;letter-spacing: 2px;}
.index-about-profile .box span{position: relative;display: block;height: 30px;line-height: 18px;margin-top: 115px;font-size: 16px;color: #fff;text-align: right;}
.index-about-profile .box span:after{content: "";position: absolute;right: 0;bottom: 0;width: 178px;border-bottom: 1px solid rgba(255, 255, 255, .6);}
.index-about-profile .box p{line-height: 30px;margin-top: 48px;font-size: 16px;color: #fff;}
.index-about-profile .box p em{font-size: 28px;}
.index-about-profile .box a{float: right;width: 110px;line-height: 30px;margin-top: 70px;border: 1px solid rgba(255, 255, 255, .6);border-radius: 3px;color: #fff;text-align: center;letter-spacing: .5px;text-transform: uppercase;}

.index-about-progress{margin: 110px 0 80px;}
.progress-list .desc{position: relative;width: 1020px;margin: 35px auto 0;overflow: hidden;}
.progress-list .desc strong{position: absolute;top: 85px;right: 240px;line-height: 180px;font-weight: bold;font-size: 230px;color: #f7f7f7;-webkit-user-select: none;user-select: none;}
.progress-list .desc .photo{float: left;width: 260px;height: 260px;overflow: hidden;border: 10px solid #eee;}
.progress-list .desc .photo img{display: block;width: 100%;}
.progress-list .desc .text{position: relative;float: right;width: 720px;}
.progress-list .desc .text h3{line-height: 45px;font-size: 22px;color: #333;}
.progress-list .desc .text p{line-height: 24px;font-size: 14px;}
.progress-list .year{position: relative;height: 60px;margin: 40px auto 0;width: 1080px;}
.progress-list .year:before{content: "";position: absolute;top: 20px;left: 0;width: 100%;border-bottom: 4px solid #bbb;}
.progress-list .year .swiper-container{width: 900px;margin: 0 auto;}
.progress-list .year li{width: 60px;}
.progress-list .year li:before{content: "";display: block;width: 16px;height: 16px;margin: 13px auto 0;background: #fff;border: 4px solid #bbb;border-radius: 50%;cursor: pointer;}
.progress-list .year li.active:before{background: #dd1017;border-color: #fff;}
.progress-list .year li span{position: relative;left: 50%;display: block;line-height: 20px;margin-top: 10px;cursor: pointer;font-weight: bold;font-size: 16px;color: #bbb;text-align: center;-webkit-transform: translateX(-50%);transform: translateX(-50%);}
.progress-list .year .arrow{position: absolute;top: 0;width: 44px;height: 44px;border: 2px solid #bbb;border-radius: 50%;}
.progress-list .year .arrow.prev{left: -60px;background-position: -304px -4px;}
.progress-list .year .arrow.next{right: -60px;background-position: -354px -4px;}

.index-news{padding: 75px 0 100px;background: #f5f5f5;}
.index-news ul{margin-top: 60px;}
.index-news li{float: left;width: 386px;height: 390px;margin-right: 20px;padding: 40px 50px 0;background: #fff;box-shadow: 0 0 30px rgba(50, 50, 50, .1);}
.index-news li:last-child{margin-right: 0;}
.index-news li .date{position: relative;margin-top: 11px;}
.index-news li .date:before{content: "";position: absolute;top: -13px;left: 22px;width: 140px;height: 86px;border: 4px solid #ccc;}
.index-news li .date .box{width: 94px;height: 65px;line-height: 18px;padding-top: 8px;background: #739996;border: 2px solid #fff;color: #fff;text-align: center;}
.index-news li .date .box em{display: block;line-height: 26px;font-size: 20px;}
.index-news li h3{margin-top: 36px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.index-news li h3 a{line-height: 24px;font-size: 20px;color: #333;}
.index-news li h3 a:hover{color: #dd1017;}
.index-news li p{display: -webkit-box;height: 66px;line-height: 22px;margin-top: 16px;overflow: hidden;color: #888;-webkit-box-orient: vertical;-webkit-line-clamp: 3;}
.index-news li .more{float: right;line-height: 16px;margin-top: 60px;color: #666;letter-spacing: .5px;text-transform: uppercase;}
.index-news li .more:before{content: "";display: inline-block;width: 12px;height: 5px;margin-right: 15px;background-position: -319px -222px;}


/****************************** 产品中心 ******************************/
.product .category{background: #e6e6e6;}
.product .category a{float: left;width: 240px;height: 128px;line-height: 20px;font-size: 16px;color: #333;text-align: center;text-transform: uppercase;}
.product .category a:nth-child(odd){background: #fff;}
.product .category a:before{content: "";display: block;width: 35px;height: 35px;margin: 24px auto 15px;}
.product .category a:nth-child(1):before{background-position: -8px -57px;}
.product .category a:nth-child(2):before{background-position: -58px -57px;}
.product .category a:nth-child(3):before{background-position: -108px -57px;}
.product .category a:nth-child(4):before{background-position: -158px -57px;}
.product .category a:nth-child(5):before{background-position: -208px -57px;}
.product .category a:hover,
.product .category a.active{background: #dd1017;color: #fff;}
.product .category a:nth-child(odd):hover,
.product .category a:nth-child(odd).active{border-right: 1px solid #fff;border-left: 1px solid #fff;}
.product .category a:hover:before,
.product .category a.active:before{background-position-y: -107px;}

.product .subcategory{width: 70%;max-width: 1200px;margin: 0 auto 50px;}
.product .subcategory .tab{margin-top: 58px;overflow: hidden;}
.product .subcategory .tab a{float: left;width: 50%;line-height: 44px;background: #f3f3f3;font-size: 16px;color: #333;text-align: center;text-transform: uppercase;}
.product .subcategory .tab a:hover,
.product .subcategory .tab a.active{background: #dd1017;color: #fff;}
.product .subcategory .tab a:nth-child(odd):hover,
.product .subcategory .tab a:nth-child(odd).active{border-right: 1px solid #f3f3f3;border-left: 1px solid #f3f3f3;}
.product .subcategory .picture{position: relative;margin-top: 45px;}
.product .subcategory .picture img{position: relative;z-index: 1;display: block;width: 50%;}
.product .subcategory .picture .box{position: absolute;top: 0;right: 0;width: 50%;height: 100%;box-shadow: 0 0 30px rgba(50, 50, 50, .1);}
.product .subcategory .picture .text{position: absolute;top: 50%;left: 0;width: 100%;padding: 0 10%;-webkit-transform: translateY(-50%);transform: translateY(-50%);}
.product .subcategory .picture .text h3{line-height: 40px;font-weight: bold;font-size: 30px;color: #333;text-align: center;text-transform: uppercase;}
.product .subcategory .picture .text p{line-height: 30px;margin-top: 36px;font-size: 16px;text-align: center;}

.product .detail{padding: 80px 0;background: #f3f3f3;}
.product .detail .title h2{line-height: 34px;font-weight: bold;font-size: 34px;color: #333;text-align: center;letter-spacing: 1px;letter-spacing: 1px;}
.product .detail .title span{display: block;line-height: 36px;font-size: 16px;color: #333;text-align: center;}
.product .detail .title span:before,
.product .detail .title span:after{content: "";display: inline-block;width: 75px;vertical-align: middle;border-bottom: 1px solid #666;}
.product .detail .title span:before{margin-right: 10px;}
.product .detail .title span:after{margin-left: 10px;}
.product .detail ul{width: 70%;max-width: 1200px;margin: 65px auto 0;box-shadow: 0 0 30px rgba(50, 50, 50, .1);}
.product .detail ul li{position: relative;}
.product .detail ul li img{display: block;width: 50%;}
.product .detail ul li .text{position: absolute;top: 0;right: 0;width: 50%;height: 100%;background: #fff;}
.product .detail ul li:nth-child(even) img{margin-left: 50%;}
.product .detail ul li:nth-child(even) .text{right: auto;left: 0;}
.product .detail ul li .text .box{position: absolute;top: 50%;width: 100%;-webkit-transform: translateY(-50%);transform: translateY(-50%);}
.product .detail ul li .text h3{line-height: 30px;font-weight: bold;font-size: 30px;color: #333;text-align: center;}
.product .detail ul li .text h3:after{content: "";display: block;width: 36px;margin: 30px auto 0;border-bottom: 2px solid #999;}
.product .detail ul li .text p{line-height: 24px;margin-top: 24px;font-size: 18px;color: #333;text-align: center;}
.product .detail ul li .text.param p{padding-left: 10%;font-size: 16px;text-align: left;}

.product .certificate{height: 650px;background: url(../images/bg-product-certificate.jpg) no-repeat center top;}
.product .certificate h2{line-height: 34px;padding-top: 80px;font-weight: bold;font-size: 34px;color: #fff;text-align: center;letter-spacing: 1px;}
.product .certificate .list{margin-top: 50px;}
.product .certificate .list a{display: block;overflow: hidden;}
.product .certificate .list a img{display: block;width: 100%;-webkit-transition: all 1s;transition: all 1s;}
.product .certificate .list a:hover img{-webkit-transform: scale(1.1);transform: scale(1.1);}
.product .certificate .arrow{position: absolute;top: 50%;width: 25px;height: 50px;margin-top: -27px;}
.product .certificate .arrow.prev{left: -48px;background-position: -12px -350px;}
.product .certificate .arrow.next{right: -48px;background-position: -62px -350px;}

.product .bottom{height: 307px;overflow: hidden;background: url(../images/bg-product-fence-bottom.jpg) no-repeat center;}
.product .bottom ul{margin-top: 76px;padding: 0 170px;}
.product .bottom ul li{position: relative;float: left;width: 150px;margin-right: 205px;text-align: center;}
.product .bottom ul li:last-child{margin: 0;}
.product .bottom ul li h3{line-height: 24px;font-size: 22px;color: #fff;}
.product .bottom ul li span{display: block;height: 52px;line-height: 26px;margin-top: 16px;font-size: 14px;color: #eee;}
.product .bottom ul li a{display: block;width: 130px;line-height: 26px;margin: 60px auto 0;background: #333;color: #ccc;text-align: center;}
.product .bottom ul li .hotline{display: block;line-height: 26px;margin: 60px auto 0;font-size: 20px;color: #fff;text-align: center;}
.product .bottom ul li:after{content: "";position: absolute;bottom: 56px;left: 37px;width: 76px;border-bottom: 1px solid #fff;}

/* 围网系统 */
.product-fence .detail ul li .text p{line-height: 20px;}

/* 笼式运动场系列 */
.product-field .detail ul li .text p{line-height: 30px;font-size: 18px;}
.product-field .detail ul li .text p a{color: #dd1017;}
.product-field .detail ul li .text p em{font-size: 14px;}
.product-field .detail ul li.light .text p{padding-left: 10%;font-size: 14px;text-align: left;}

.product-field .reason{height: 672px;padding-top: 80px;background: url(../images/bg-product-field-reason.jpg) no-repeat center top;}
.product-field .reason h2{line-height: 30px;font-weight: bold;font-size: 30px;color: #333;text-align: center;letter-spacing: .5px;}
.product-field .reason h2 em{display: inline-block;margin: 0 5px;color: #dd1017;text-transform: uppercase;}
.product-field .reason dl dt{margin: 56px 0 26px;overflow: hidden;}
.product-field .reason dl dt span{float: left;line-height: 24px;padding-right: 0 !important;font-weight: bold;font-size: 20px;color: #dd1017;}
.product-field .reason dl dd{padding: 15px 0;overflow: hidden;border-top: 1px dotted #ccc;}
.product-field .reason dl dd span{position: relative;float: left;line-height: 32px;font-size: 14px;color: #333;}
.product-field .reason dl dd span.double{line-height: 16px;}
.product-field .reason dl dd span:after{content: "";position: absolute;top: 11px;right: 0;height: 10px;border-left: 2px solid #ddd;}
.product-field .reason dl dd span:last-child:after{content: none;}
.product-field .reason dl dd span i{display: inline-block;width: 30px;line-height: 28px;margin-top: 1px;border: 1px solid #888;border-radius: 50%;font-weight: bold;font-size: 20px;color: #333;text-align: center;}
.product-field .reason dl span:nth-child(1){width: 112px;text-align: center;}
.product-field .reason dl span:nth-child(2){width: 249px;padding: 0 12px 0 24px;}
.product-field .reason dl span:nth-child(3){width: 418px;padding: 0 66px 0 54px;}
.product-field .reason dl span:nth-child(4){width: 420px;padding: 0 68px;}

.product-field .certificate .box{width: 620px;margin: 50px auto 0;}
.product-field .certificate .box a{float: left;width: 290px;margin: 0 10px;}
.product-field .certificate .box a img{display: block;width: 100%;height: 400px;}
.product-field .certificate .box a:hover img{-webkit-transform: scale(1.1);transform: scale(1.1);}

/* 儿童球场系列 */
.product-children .subcategory .tab a{width: 33.33%;}

/* 少儿拓展器材系列 */
.product-equipment .scene .swiper-container{margin-top: 80px;}
.product-equipment .scene li{height: 276px;overflow: hidden;cursor: pointer;}
.product-equipment .scene li:nth-child(4n){margin-right: 0;}
.product-equipment .scene li img{position: relative;left: 50%;display: block;height: 100%;-webkit-transform: translateX(-50%);transform: translateX(-50%);}
.product-equipment .scene li span{position: absolute;bottom: 0;left: 0;width: 100%;line-height: 18px;padding: 12px 0 12px 18px;background: rgba(0, 0, 0, .8);font-size: 14px;color: #f3f3f3;}
.product-equipment .scene li span em{display: block;}
.product-equipment .scene li p{display: none;}
.product-equipment .scene .arrow{margin: 40px 0 56px;overflow: hidden;}
.product-equipment .scene .arrow a{float: left;width: 34px;height: 34px;margin-right: 10px;border: 1px solid #ccc;}
.product-equipment .scene .arrow a.prev{background-position: -258px -58px;}
.product-equipment .scene .arrow a.next{background-position: -308px -58px;}
.product-equipment .scene .arrow a:hover{background-color: #dd1017;background-position-y: -108px;border-color: #dd1017;}

.popup-scene{position: fixed;top: 0;left: 0;z-index: 100;display: none;width: 100%;height: 100%;background: rgba(0, 0, 0, .5);}
.popup-scene .box{position: absolute;top: 50%;left: 50%;width: 800px;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
.popup-scene .box .close{position: absolute;top: 0;right: -80px;width: 60px;height: 60px;background-position: -195px -344px;border: 1px solid #fff;border-radius: 50%;cursor: pointer;}
.popup-scene .box .text{padding: 10px 30px;background: #222;}
.popup-scene .box .text span{display: block;line-height: 28px;font-size: 16px;color: #f3f3f3;}
.popup-scene .box .text span em{display: inline-block;width: 35px;}
.popup-scene .box .text p{line-height: 20px;color: #bbb;}

/* 体育公园系列 */
.product-park .subtitle{position: relative;width: 400px;height: 26px;line-height: 45px;margin: 30px auto 0;border: 1px solid #dd1017;border-bottom: none;font-size: 16px;color: #333;text-align: center;}
.product-park .subtitle:before,
.product-park .subtitle:after{content: "";position: absolute;bottom: 0;width: 28px;border-bottom: 1px solid #dd1017;}
.product-park .subtitle:before{left: 0;}
.product-park .subtitle:after{right: 0;}
.product-park .main{display: block;margin: 75px auto;}


/****************************** 应用案例 ******************************/
.case .banner ul{max-height: 760px;overflow: hidden;}
.case .banner .thumb{position: absolute;bottom: -44px;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);}
.case .banner .thumb img{float: left;width: 88px;height: 88px;margin: 0 7px;border: 4px solid #eee;opacity: .6;cursor: pointer;}
.case .banner .thumb img.active{opacity: 1;}
.case .banner .thumb:after{content: none;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.case .banner .thumb.disable:after{content: "";}

.case .page-title{margin-top: 120px;}
.case .category{margin-top: 50px;overflow: hidden;}
.case .category a{float: left;width: 230px;line-height: 32px;margin: 0 12px 8px 0;border: 1px solid #ccc;border-radius: 17px;font-size: 14px;color: #333;text-align: center;}
.case .category a:nth-child(5n){margin-right: 0;}
.case .category a:hover,
.case .category a.active{background: #dd1017;border-color: #dd1017;color: #fff;}
.case .list{margin-top: 36px;overflow: hidden;}
.case .list a{position: relative;float: left;width: 276px;height: 276px;margin: 0 32px 36px 0;overflow: hidden;}
.case .list a:nth-child(4n){margin-right: 0;}
.case .list a img{display: block;width: 100%;}
.case .list a .name{position: absolute;bottom: 0;left: 0;width: 100%;height: 56px;overflow: hidden;background: rgba(0, 0, 0, .5);}
.case .list a .name span{position: absolute;bottom: 20px;left: 0;width: 100%;line-height: 18px;font-size: 14px;color: #fff;text-align: center;}
.case .list a .name span:before{content: "";display: block;width: 75px;height: 75px;margin: 0 auto 28px;background-position: -13px -412px;border: 1px solid #fff;border-radius: 50%;}
.case .list a:hover .name{height: 100%;}
.case .list a:hover .name span{bottom: 88px;}
.case .pagination{margin: 38px 0 74px;}

.case-detail{margin-top: 120px;}
.case-detail .title{line-height: 30px;font-size: 26px;color: #333;text-align: center;}
.case-detail .upload{margin-top: 36px;}
.case-detail .upload p,
.case-detail .upload span{font-size: 14px !important;}
.case-detail .back{padding: 60px 0;overflow: hidden;border-top: 1px dotted #ccc;}
.case-detail .back a{float: right;width: 110px;line-height: 34px;border: 1px solid #ccc;border-radius: 3px;font-size: 14px;color: #333;text-align: center;}


/****************************** 服务支持 ******************************/
.service-category{background: #f3f3f3;}
.service-category a{float: left;width: 400px;line-height: 60px;font-size: 18px;color: #333;text-align: center;}
.service-category a:nth-child(even){background: #fff;}
.service-category a:hover,
.service-category a.active{background: #dd1017;color: #fff;}
.service-category a:nth-child(odd):hover,
.service-category a:nth-child(odd).active{border-right: 1px solid #fff;border-left: 1px solid #fff;}

.service-policy .tooltip span{display: block;line-height: 40px;margin-top: 32px;font-size: 16px;color: #333;text-align: center;}
.service-policy .tooltip p{line-height: 20px;font-size: 14px;color: #888;text-align: center;}
.service-policy .form{padding: 0 16px;}
.service-policy .form dl dt{line-height: 74px;font-size: 20px;color: #333;}
.service-policy .form dl dd{position: relative;float: left;width: 570px;margin-bottom: 20px;}
.service-policy .form dl dd:nth-of-type(even){float: right;}
.service-policy .form dl dd:last-of-type{width: 100%;}
.service-policy .form dl dd input,
.service-policy .form dl dd textarea{width: 100%;line-height: 20px;padding: 17px 0 17px 57px;border: 2px solid #dee6ec;border-radius: 3px;font-size: 14px;color: #333;}
.service-policy .form dl dd textarea{height: 170px;}
.service-policy .form dl dd:before{content: "";position: absolute;top: 17px;left: 17px;width: 24px;height: 24px;}
.service-policy .form dl:nth-child(1) dd:nth-of-type(1):before{background-position: -13px -163px;}
.service-policy .form dl:nth-child(1) dd:nth-of-type(2):before{background-position: -63px -163px;}
.service-policy .form dl:nth-child(1) dd:nth-of-type(3):before{background-position: -113px -163px;}
.service-policy .form dl:nth-child(1) dd:nth-of-type(4):before{background-position: -163px -163px;}
.service-policy .form dl:nth-child(1) dd:nth-of-type(5):before{background-position: -213px -163px;}
.service-policy .form dl:nth-child(2) dd:nth-of-type(1):before{background-position: -263px -163px;}
.service-policy .form dl:nth-child(2) dd:nth-of-type(2):before{background-position: -313px -163px;}
.service-policy .form dl:nth-child(2) dd:nth-of-type(3):before{background-position: -363px -163px;}
.service-policy .form a{display: block;width: 150px;line-height: 48px;margin: 10px auto 45px;background: #dd1017;border-radius: 3px;font-size: 14px;color: #fff;text-align: center;}

.service-faq ul{margin: 50px 0;}
.service-faq ul li{margin-bottom: 36px;}
.service-faq ul li h3{line-height: 20px;font-size: 18px;color: #333;}
.service-faq ul li h3:before{content: "";display: inline-block;width: 20px;height: 20px;margin-right: 18px;vertical-align: middle;background-position: -15px -215px;}
.service-faq ul li p{position: relative;line-height: 24px;margin-top: 30px;padding: 8px 35px 8px 70px;background: #f3f3f3;font-size: 14px;color: #333;}
.service-faq ul li p.single{line-height: 44px;}
.service-faq ul li p:before{content: "";position: absolute;top: 20px;left: 20px;width: 24px;height: 22px;background-position: -63px -214px;}

.service-brochure{height: 847px;background: url(../images/bg-service-brochure.jpg) no-repeat center top;overflow: hidden;}
.service-brochure .wrapper{width: 1000px;height: 700px;margin: 85px auto 0;padding: 0 25px;background: #fff;}
.service-brochure .page-title{padding-top: 30px;}
.service-brochure .video{position: absolute;height: 535px;width: 950px;top: 670px;left: 50%;margin-left: -465px;z-index: 10;}
.service-brochure .video .video-js{width: 100% !important;height: 100% !important;background: none !important;}
.service-brochure .video .play{position: absolute;top: 50%;left: 50%;width: 60px;height: 60px;margin: -30px 0 0 -30px;background-color: #dd1017;background-position: -95px -195px;border: 2px solid #fff;border-radius: 50%;}


/****************************** 新闻中心 ******************************/
.news .top{padding-bottom: 85px;overflow: hidden;background: #ededed;}
.news .top .wrapper{margin-top: 55px;}
.news .top .thumb{float: left;width: 600px;height: 337px;overflow: hidden;}
.news .top .thumb img{display: block;width: 100%;-webkit-transition: all 1s;transition: all 1s;}
.news .top .thumb:hover img{-webkit-transform: scale(1.1);transform: scale(1.1);}
.news .top .text{float: right;width: 540px;}
.news .top .text span{display: block;line-height: 24px;font-size: 24px;color: #555;text-transform: uppercase;}
.news .top .text h3{line-height: 20px;margin-top: 25px;font-weight: bold;font-size: 18px;color: #333;}
.news .top .text h3:after{content: "";display: block;width: 40px;margin-top: 18px;border-bottom: 1px solid #ddd;}
.news .top .text p{line-height: 28px;margin-top: 15px;font-size: 14px;color: #333;}
.news .top .text a{display: block;line-height: 60px;margin-top: 90px;background: #dd1017;border-radius: 3px;font-size: 14px;color: #fff;text-align: center;}
.news .top .text a:before{content: "";display: inline-block;width: 20px;height: 12px;margin-right: 15px;vertical-align: middle;background-position: -215px -219px;}

.news ul{margin-top: 75px;}
.news ul li{margin-bottom: 50px;overflow: hidden;}
.news ul li .thumb{float: left;width: 380px;height: 213px;overflow: hidden;}
.news ul li .thumb img{display: block;width: 100%;-webkit-transition: all 1s;transition: all 1s;}
.news ul li .thumb:hover img{-webkit-transform: scale(1.1);transform: scale(1.1);}
.news ul li .text{float: right;width: 780px;height: 213px;border-bottom: 1px solid #999;}
.news ul li .text h3{line-height: 20px;font-weight: bold;font-size: 18px;color: #333;}
.news ul li .text h3:after{content: "";display: block;width: 40px;margin-top: 18px;border-bottom: 1px solid #ddd;}
.news ul li .text p{line-height: 30px;margin-top: 10px;font-size: 14px;color: #333;}
.news ul li .text span{float: left;line-height: 16px;margin-top: 40px;font-size: 14px;color: #999;}
.news ul li .text span:before{content: "";display: inline-block;width: 14px;height: 14px;margin-right: 6px;vertical-align: bottom;background-position: -268px -218px;}
.news ul li .text a{float: right;width: 120px;line-height: 40px;margin-top: 34px;background: #dd1017;border-radius: 3px;font-size: 14px;color: #fff;text-align: center;}
.news ul li .text a:before{content: "";display: inline-block;width: 20px;height: 12px;margin-right: 8px;vertical-align: middle;background-position: -215px -219px;}
.news .pagination{margin: 25px 0 65px;}

.news-detail h1{line-height: 30px;margin-top: 120px;font-weight: bold;font-size: 24px;color: #333;text-align: center;}
.news-detail .attr{line-height: 60px;margin-bottom: 20px;border-bottom: 1px dotted #ddd;font-size: 14px;color: #888;text-align: center;}
.news-detail .attr em{display: inline-block;width: 50px;}
.news-detail .upload,
.news-detail .upload p,
.news-detail .upload span{font-size: 14px !important;}
.news-detail .jump{position: relative;margin-top: 50px;padding: 35px 0 55px;}
.news-detail .jump span{display: block;line-height: 25px;font-size: 14px;color: #999;}
.news-detail .jump span a:hover{color: #dd1017;}
.news-detail .jump .back{position: absolute;top: 35px;right: 0;width: 110px;line-height: 34px;border: 1px solid #ccc;border-radius: 3px;font-size: 14px;color: #333;text-align: center;}


/****************************** 关于我们 ******************************/
.about .section-title{margin-top: 80px;text-align: center;text-transform: uppercase;}
.about .section-title .cn{display: block;line-height: 36px;font-weight: bold;font-size: 36px;color: #333;letter-spacing: 1px;}
.about .section-title .en{display: block;line-height: 36px;font-size: 22px;color: #ccc;letter-spacing: .5px;}

.about .profile{padding-bottom: 80px;background: #f3f3f3;overflow: hidden;}
.about .profile .text{margin-top: 40px;}
.about .profile .text p{line-height: 24px;margin-bottom: 24px;font-size: 14px;color: #333;}

.about .culture{margin-top: 80px;padding-bottom: 110px;}
.about .culture .section-title{position: absolute;top: 183px;left: 0;z-index: 1;width: 100%;margin: 0;}
.about .culture ul{position: relative;height: 460px;background: url(../images/bg-about-culture.jpg) no-repeat center top;}
.about .culture ul li{position: absolute;line-height: 20px;font-size: 14px;color: #333;}
.about .culture ul li b{font-size: 16px;}
.about .culture ul li:nth-child(-n+4){left: 42px;}
.about .culture ul li:nth-child(n+5){left: 862px;}
.about .culture ul li:nth-child(1){top: 9px;}
.about .culture ul li:nth-child(2){top: 182px;}
.about .culture ul li:nth-child(3){top: 318px;}
.about .culture ul li:nth-child(4){top: 442px;}
.about .culture ul li:nth-child(5){top: 10px;}
.about .culture ul li:nth-child(6){top: 180px;}
.about .culture ul li:nth-child(7){top: 328px;}
.about .culture ul li:nth-child(8){top: 441px;}

.about .progress{padding-bottom: 130px;background: #434343;overflow: hidden;}
.about .progress .section-title span{color: #fff;}
.about .progress .progress-list .desc strong{color: #555;}
.about .progress .progress-list .desc .text h3{color: #fff;}
.about .progress .progress-list .desc .text p{color: #ccc;}

.about .responsibility .wrapper{margin-top: 65px;padding: 0 60px;}
.about .responsibility .swiper-container{background: #fff;border: 1px solid #ddd;}
.about .responsibility li img{float: left;width: 537px;height: 340px;}
.about .responsibility li .text{float: left;width: 541px;padding-left: 80px;}
.about .responsibility li .text h3{line-height: 38px;margin-top: 50px;font-size: 40px;color: #333;}
.about .responsibility li .text h3:after{content: "";display: block;width: 18px;margin-top: 20px;border-bottom: 1px solid #bbb;}
.about .responsibility li .text span{display: block;line-height: 18px;margin-top: 20px;font-size: 16px;color: #333;}
.about .responsibility li .text p{line-height: 20px;margin-top: 14px;}
.about .responsibility .arrow{position: absolute;top: 50%;width: 24px;height: 44px;margin-top: -22px;}
.about .responsibility .arrow.prev{left: 0;background-position: -113px -303px;}
.about .responsibility .arrow.next{right: 0;background-position: -163px -303px;}

.about .certificate{margin-top: 85px;padding-bottom: 75px;overflow: hidden;background: #f3f3f3;}
.about .certificate .wrapper{margin-top: 55px;padding: 0 36px;}
.about .certificate a{overflow: hidden;}
.about .certificate a img{display: block;width: 100%;-webkit-transition: all 1s;transition: all 1s;}
.about .certificate a:hover img{-webkit-transform: scale(1.1);transform: scale(1.1);}
.about .certificate .arrow{content: "";position: absolute;top: 50%;width: 16px;height: 25px;margin-top: -8px;}
.about .certificate .arrow.prev{left: 0;background-position: -417px -12px;}
.about .certificate .arrow.next{right: 0;background-position: -467px -12px;}


/****************************** 联系我们 ******************************/
.contact ul{float: left;margin: 45px 0 0 55px;}
.contact ul li{line-height: 40px;font-size: 16px;color: #333;}
.contact ul li label{font-weight: bold;font-size: 18px;}
.contact ul li:before{content: "";display: inline-block;width: 24px;height: 24px;margin-right: 16px;vertical-align: middle;}
.contact ul li:nth-child(1):before{background-position: -14px -263px;}
.contact ul li:nth-child(2):before{background-position: -64px -263px;}
.contact ul li:nth-child(3):before{background-position: -114px -263px;}
.contact ul li:nth-child(4):before{background-position: -164px -263px;}
.contact ul li:nth-child(5):before{background-position: -214px -263px;}
.contact ul li:nth-child(6):before{background-position: -264px -263px;}

.contact .hotline{float: right;margin: 100px 150px 0 0;text-align: center;}
.contact .hotline strong{display: block;line-height: 40px;font-weight: bold;font-size: 36px;font-family: "Microsoft YaHei";color: #dd1017;letter-spacing: .5px;}
.contact .hotline strong:before{content: "";display: inline-block;width: 40px;height: 40px;margin-right: 10px;vertical-align: bottom;background-position: -305px -256px;}
.contact .hotline span{display: block;line-height: 36px;font-size: 18px;color: #333;}
.contact .human{clear:both;float:none;display:block;color:#dd1017;padding:40px 0 55px 100px;font-size:16px;font-weight:bold;}
.contact .map{height: 570px;}
.contact .BMap_cpyCtrl,
.contact .anchorBL{display: none;}


/****************************** CSS3 Media ******************************/
@media (max-width: 1650px){
	.product .detail ul li .text.param p{margin-top: 18px;font-size: 13px;}
    .product .detail ul li .text.param h3:after{margin-top: 20px;}
}
@media (max-width: 1440px){
	.product .detail ul li .text.param p{margin-top: 12px;font-size: 12px;}
    .product .detail ul li .text.param h3:after{margin-top: 10px;}
}


/****************************** CSS3 Media ******************************/
[animation-name]{
	visibility: hidden;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

@-webkit-keyframes fadeInLeft50 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-50px, 0, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInLeft50 {
	from {
		opacity: 0;
		transform: translate3d(-50px, 0, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@-webkit-keyframes fadeInRight50 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(50px, 0, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInRight50 {
	from {
		opacity: 0;
		transform: translate3d(50px, 0, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@-webkit-keyframes fadeInUp50 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 50px, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInUp50 {
	from {
		opacity: 0;
		transform: translate3d(0, 50px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@-webkit-keyframes fadeInDown50 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, -50px, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInDown50 {
	from {
		opacity: 0;
		transform: translate3d(0, -50px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@-webkit-keyframes fadeInLeft100 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-100px, 0, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInLeft100 {
	from {
		opacity: 0;
		transform: translate3d(-100px, 0, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@-webkit-keyframes fadeInRight100 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(100px, 0, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInRight100 {
	from {
		opacity: 0;
		transform: translate3d(100px, 0, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@-webkit-keyframes fadeInUp100 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 100px, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInUp100 {
	from {
		opacity: 0;
		transform: translate3d(0, 100px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@-webkit-keyframes fadeInDown100 {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, -100px, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInDown100 {
	from {
		opacity: 0;
		transform: translate3d(0, -100px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@-webkit-keyframes ripple {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1)
    }
    
    5% {
        opacity: 1
    }
    
    100% {
        opacity: 0;
        -webkit-transform: scale(1)
    }
}
@keyframes ripple {
    0% {
        opacity: 0;
        transform: scale(.1)
    }
    
    5% {
        opacity: 1
    }
    
    100% {
        opacity: 0;
        transform: scale(1)
    }
}
