/*大图*/
.slider {background:#000;}



/*品牌简介*/
.home-about {
    /* background: #1f1f1f; */
    /* background: url(../images/home-about-bg.jpg) no-repeat center right; */
}
.home-about .about-box {
    /* overflow:hidden; */
    padding: 8% 0 8% 0;
    position: relative;
}
.home-about .about-box {
    /* background: url(../images/home-about-bg.png) no-repeat center right; */
}
.home-about .about-box h2 {
    font-size: 49px;
    color: #fede7c;
    font-weight: bold;
    padding:0 8px;
    margin-left: 36px;
    /* max-width: 188px; */
    position: relative;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 0.2s;
}

.home-about .about-box h2:before {
    content: "";
    position: absolute;
    left: -63px;
    top: 34px;
    width: 16px;
    height: 16px;
    border: 2px solid #f4e295;
    z-index: 25;
    border-radius:100%;
    transition: all 0.3s;
}

.home-about .about-box h2:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 20px;
    width:0;
    height: 0px;
    background: #383838;
    z-index: -1;
    transition: all 0.3s;
}
.home-about .about-box .introduce {
    width:50%;
    padding: 80px 0 0 36px;
}
.home-about .about-box .introduce .content {
	visibility: visible;
	animation-name: fadeInUp;
	animation-delay: 0.8s;
}
.home-about .about-box .introduce .content p {
    font-size: 15px;
    color: #cacaca;
    padding-right: 78px;
    line-height: 1.8;
}

.home-about .about-box .tab {
    padding:60px 0 66px 0;
}
.home-about .about-box .tab ul {
    overflow:hidden;
}
.home-about .about-box .tab ul li {
    float: left;
    width:24%;
    text-align: center;
	
	visibility: visible;
	animation-name: fadeInUp;
}
.home-about .about-box .tab ul li:nth-of-type(1) {
	animation-delay: 1.4s;
}
.home-about .about-box .tab ul li:nth-of-type(2) {
	animation-delay: 1.6s;
}
.home-about .about-box .tab ul li:nth-of-type(3) {
	animation-delay: 1.8s;
}
.home-about .about-box .tab ul li:nth-of-type(4) {
	animation-delay: 2s;
}

.home-about .about-box .tab ul li i {
    display: inline-block;
}
.home-about .about-box .tab ul li i img {
    width:54px;
}
.home-about .about-box .tab ul li p {
    font-size: 12px;
    color: #e6e6e6;
}

.home-about .about-box .more {
	visibility: visible;
	animation-name: fadeInUp;
	animation-delay: 2.8s;
}
.home-about .about-box .more a {
    display:block;
    width:108px;
    padding:5px;
    color: #3a3a3a;
    text-align: center;
    border-radius: 25px;
    transition: all 0.5s;
    background: #fede7c;
}
.home-about .about-box .more a:hover {
	padding:5px 5px 5px 10px;
	background: #fede7c url(../images/videoplay.svg) no-repeat 12px center/12px;
}
.join-hall .hall ul li i .p1 {
    border: 1px solid #fff;
    width: 50px;
    height: 50px;
    left: 0px;
    top: -4px;
}

.home-about .about-box .number {
    width:50%;
    padding: 12% 0% 0 6%;
    position: relative;
}
.home-about .about-box .number ul {}
.home-about .about-box .number ul li {
    float:left;
    width:50%;
    margin-bottom: 100px;
}
.home-about .about-box .number ul li .p1 {
    font-size: 72px;
    color: #fede7c;
    font-family: 'Futura';
    padding:0 2px;
    position: relative;
}
.home-about .about-box .number ul li .p1:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 60px;
    width: 100%;
    height: 15px;
    background: #f4de26;
    z-index: -1;
    transition: all 0.3s;
}
.home-about .about-box .number ul li .p2 {
    font-size: 24px;
    color: #a09e9e;
    padding:0 20px 0 10px;
}
.home-about .about-box .number ul li .p3 {
    font-size: 14px;
    color: #bbb;
}

.home-about .about-box .number .brand {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    animation: cir-scale 3s linear infinite;
}

.home-about .about-box .number .brand span {
    font-size: 150px;
    color: #efeeeb;
    font-weight: bold;
}


/*产品系列*/
.home-series {
    height: 700px;
    position: relative;
}
.home-series .series-item {
    float:right;
    width:389px;
    height:558px;
    margin-top: 230px;
    overflow:hidden;
	position: relative;
}
.home-series .series-item ul {}
.home-series .series-item ul li {
    display:none;
    float:left;
    width:389px;
    height:436px;
}
.home-series .series-item ul li.on {
    display:block;
}
.home-series .series-item ul li .pro-series {
    float: right;
    width:389px;
    height:558px;
    background: #fafafa;
    padding:60px 30px;
}
.home-series .series-item ul li .pro-series h3 {
    font-size: 36px;
    color:#000;
    position: relative;
	
	visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 0.4s;
}
.home-series .series-item ul li .pro-series h3:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 70px;
    width:70px;
    height: 4px;
    background: #342923;
    z-index: 1;
    transition: all 0.3s;
}
.home-series .series-item ul li .pro-series h4 {
    font-size: 18px;
    color:#3a3a3a;
    font-family: 'Futura';
    margin: 76px 0 44px 0;
}
.home-series .series-item ul li .pro-series p {
    font-size: 14px;
    color:#3a3a3a;
    height:115px;
}
.home-series .series-item ul li .pro-series a {
    display: block;
    width: 108px;
    padding: 5px;
    color: #3a3a3a;
    text-align: center;
    border-radius: 25px;
    background: #b1afaf;
    transition: all 0.5s;
}
.home-series .series-item ul li .pro-series a:hover {
	padding:5px 5px 5px 10px;
	background: #fff url(../images/videoplay.svg) no-repeat 12px center/12px;
}

.pic-item {
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}
.helper {
    float:right;
    margin-right: 50px;
    width:62px;
    height:26px;
}
.helper .prev,.helper .next {
    z-index: 1;
    display: block;
    width: 26px;
    height: 26px;
    margin-right: 5px;
    float: left;
    text-align: center;
    background: #b1afaf;
    cursor: pointer;
    transition: all 0.5s;
}
.helper .prev:hover, .helper .next:hover {
    background: #fff;
	
}
.helper .prev:hover{
	transform: translate(-5px,-0);
}
.helper .next:hover{
	transform: translate(5px,-0);
}


#main {overflow: hidden; zoom: 1; position: relative;height: 700px; }
#index_b_hero { width: 1920px; height:100%; margin: auto; position: relative; }
#index_b_hero img { width: 100%; height: 100%; margin:0 auto;}


/*产品系列-圈圈*/
.home-series .series-item i {
    display: block;
    height: 48px;
    position: absolute;
    text-align: center;
    left: 21%;
    top: 22%;
    width: 100%;
    z-index: 1;
}
.home-series .series-item i span {
    position: absolute;
    display: block;
    border-radius: 50%;
    animation: cir-scale 3s linear infinite;
}
.home-series .series-item i .p1 {
    border: 1px solid #fff;
    width: 50px;
    height: 50px;
    left: 0px;
    top: -4px;
}
.home-series .series-item i .p2 {
    border: 1px solid rgba(255, 255, 255, 0.4);
    width: 120px;
    height: 120px;
    left: -36px;
    top: -36px;
}
.home-series .series-item i .p3 {
    border: 1px solid rgba(255, 255, 255, 0.2);
    width: 200px;
    height: 200px;
    left: -76px;
    top: -76px;
}

/*视频专区*/
.home-video {
    padding:8% 0 4% 0;
    background: #080808;
}

/*视频专区-展厅*/
.showhall {
    margin-bottom: 110px;
    overflow:hidden;
}
.showhall .pic {
    width: 870px;
    height: 545px;
    overflow:hidden;
    position: relative;
}
.showhall .pic:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    transition: all 0.3s;
    background: rgba(0, 0, 0, 0.0) url(../images/play.svg) no-repeat center center;
    background-size: 30px;
}
.showhall .pic img {
	animation: myfirst 25s linear infinite normal;
    transform: scale(1.1,1.1);
	transition: all 1s;
}
.showhall .pic:hover img {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}
.showhall .item {
    width: 560px;
    margin-top: 30px;
    margin-right: 100px;
}
.showhall .item h3 {
    font-size: 49px;
    color: #fff;
    font-weight: bold;
    padding: 0 8px 38px 0;
    /* max-width: 256px; */
    position: relative;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 0.4s;
}
.showhall .item h3:before {
    content: "";
    position: absolute;
    right: 120px;
    top: 16px;
    width: 16px;
    height: 16px;
    border: 2px solid #f4e295;
    z-index: -1;
    border-radius:100%;
    transition: all 0.3s;
}

.showhall .item h3:after {
    content: "";
    position: absolute;
    right: -216px;
    top: 40px;
    width: 320px;
    height: 90px;
    /* background: #4a4a4a82; */
    z-index: -1;
    transition: all 0.3s;
}

.showhall .item h4 {
    font-size: 24px;
    color: #6b6a6a;
    font-family: 'Futura';
    text-transform: uppercase;
    margin: 50px 0 20px 0;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 0.8s;
}
.showhall .item .p1 {
    font-size: 18px;
    color: #e6e6e6;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 0.4s;
}
.showhall .item .p2 {
    font-size: 16px;
    color: #e6e6e6;
    margin: 40px 0 30px 0;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 0.6s;
    line-height: 2;
}
.showhall .item .p3 {
    width: 108px;
    padding: 5px;
    color: #3a3a3a;
    text-align: center;
    border-radius: 25px;
    background: #f4de26;
	
	visibility: visible;
	animation-name: fadeInUp;
	animation-delay: 1.5s;
}
.showhall .item .p3 {
    padding-left: 25px;
    background: #ffdf7d url(../images/videoplay.svg) no-repeat 12px center;
    background-size: 12px;
    transition: all 0.3s;
}
.showhall .item .p3:hover {
    background: #ceb054 url(../images/videoplay.svg) no-repeat 18px center;
    background-size: 12px;
}

/*视频专区-水墨京砖*/
.shuimo {
    overflow:hidden;
}
.shuimo .item {
    width: 300px;
    margin-left: 2%;
}
.shuimo .item h3 {
    font-size: 49px;
    color: #fff;
    font-weight: bold;
    padding: 0 8px;
    max-width: 136px;
    position: relative;
    visibility: visible;
    animation-name: fadeInUp;
}
.shuimo .item h3:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 20px;
    width: 100%;
    height: 20px;
    background: #353535;
    z-index: -1;
    transition: all 0.3s;
}
.shuimo .item h4 {
    font-size: 24px;
    color: #6b6a6a;
    font-family: 'Futura';
    text-transform: uppercase;
    margin:40px 0 60px 0;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 1.5s;
}
.shuimo .item .p1 {
    font-size: 16px;
    color: #e0e0e0;
    margin-bottom: 20px;
    visibility: visible;
    animation-name: fadeInRight;
}
.shuimo .item .p1:nth-of-type(1) {
	animation-delay: 0.4s;
}
.shuimo .item .p1:nth-of-type(2) {
	animation-delay: 0.8s;
}
.shuimo .item .p1:nth-of-type(3) {
	animation-delay: 1.2s;
}
.shuimo .item .p1 span {
    font-size: 26px;
    color: #000;
    font-weight: bold;
    display:inline-block;
    width: 50px;
    height:50px;
    line-height: 50px;
    text-align: center;
    border-radius: 50%;
    margin:5px;
    background: #ffdf7d;
    position: relative;
}
.shuimo .item .p1 span:after {
	content: "";
    position: absolute;
    left: -3px;
    top: -3px;
    border: 1px solid rgba(244, 222, 38, 0.2);
    width: 55px;
    height: 55px;
    border-radius: 50%;
	animation: cir-scale 3s linear infinite;
}
.shuimo .item .p1 span:before {
	content: "";
    position: absolute;
    left: -5px;
    top: -5px;
    border: 1px solid rgba(244, 222, 38, 0.4);
    width: 60px;
    height: 60px;
    border-radius: 50%;
	animation: cir-scale 3s linear infinite;
}


.shuimo .itemplay {
    width: 260px;
}
.shuimo .itemplay .p1 {
    text-align: left;
    margin-bottom: 210px;
}
.shuimo .itemplay .p2 {
    width: 108px;
    padding: 5px;
    color: #3a3a3a;
    text-align: center;
    border-radius: 25px;
    background: #f4de26;
	
}
.shuimo .itemplay .p2 {
    padding-left: 25px;
    background: #ffdf7d url(../images/videoplay.svg) no-repeat 12px center;
    background-size: 12px;
    transition: all 0.3s;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 2.5s;
}
.shuimo .itemplay .p2:hover {
    background: #ceb054 url(../images/videoplay.svg) no-repeat 18px center;
    background-size: 12px;
}
.shuimo .pic {
    width:733px;
	height:378px;
	overflow:hidden;
	position: relative;
}
.shuimo .pic:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    transition: all 0.3s;
    background: rgba(0, 0, 0, 0.0) url(../images/play.svg) no-repeat center center;
    background-size: 30px;
}
.shuimo .pic img {
	animation: myfirst 25s linear infinite normal;
    transform: scale(1.1,1.1);
	transition: all 1s;
}
.shuimo .pic:hover img {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}

.home-dongfang {
    height:763px;
    background:url(../images/home-dongfang-bg.jpg) no-repeat center top;
}
.home-dongfang .item {
    width:50%;
    padding:10% 3% 0 3%;
}
.home-dongfang .item h3 {
    font-size: 22px;
    color: #fff;
    font-family: 'Futura';
    text-transform: uppercase;
    margin-bottom: 40px;
    visibility: visible;
    animation-name: fadeInUp;
}
.home-dongfang .item h4 {
    font-size: 49px;
    color: #fff;
    margin-bottom: 20px;
    visibility: visible;
    animation-name: fadeInUp;
    font-weight: bold;position:relative;
}

.home-dongfang .item h4:before {
    content: "";
    position: absolute;
    left: -63px;
    top: 34px;
    width: 16px;
    height: 16px;
    border: 2px solid #f4e295;
    z-index: 0;
    border-radius:100%;
    transition: all 0.3s;
}

.home-dongfang .item p {
    font-size: 16px;
    color: #fff;
    /* margin-bottom: 60px; */
    visibility: visible;
    animation-name: fadeInUp;
    line-height: 2.3;
}
.home-dongfang .item p span{
    display:inline-block; border:1px solid #eaeaea; padding:0 10px;margin:0 4px; margin-bottom:5px;
}
.home-dongfang .item p span:hover{ border-color:#fede7d;}
/* .home-dongfang .item a {
    display:block;
    width: 140px;
    padding: 10px;
    color: #3a3a3a;
    text-align: center;
    border-radius: 10px;
    background: #ffdf7d;
    overflow:hidden;
    position: relative;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 1s;
}
.home-dongfang .item a:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 10px;
    height: 10px;
    border-radius: 50px;
    background: #ceb054;
    z-index: -1;
    transition: all 0.3s;
}
.home-dongfang .item a:hover:after {
	width: 100%;
	height: 100%;
	color: #000;
	border-radius:10px;
} */



.moreall {
    display:block;
    width: 140px;
    padding: 10px;
    color: #3a3a3a;
    text-align: center;
    border-radius: 10px;
    background: #ffdf7d;
    overflow:hidden;
    position: relative;
    visibility: visible;
    animation-name: fadeInUp;
    animation-delay: 1s;
}
.moreall:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 0px;
    height: 0px;
    /* border-radius: 50px; */
    background: #ffebad;
    z-index: -1;
    transition: all 0.3s;
}
.moreall:hover:after {
	width: 100%;
	height: 100%;
	color: #000;
	border-radius:10px;
}

.news {
    padding:5% 0 2% 0;
    overflow:hidden;
    background: linear-gradient(to bottom, #010101,#000000);
    background: url(../images/home-new-bg.jpg) no-repeat top center;
}
.news .newsmenu {
    margin-bottom: 60px;
    /* overflow:hidden; */
    height: 90px;
}
.news .newsmenu .fl {
	visibility: visible;
	animation-name: fadeInUp;
}
.news .newsmenu .fl h3 {
    font-size: 49px;
    color: #ffffff;
    font-weight: bold;
    margin-bottom: 10px;
    position: relative;
}

.news .newsmenu .fl h3:before {
    content: "";
    position: absolute;
    left: 203px;
    top: 61px;
    width: 16px;
    height: 16px;
    border: 2px solid #f4e295;
    z-index: 0;
    border-radius:100%;
    transition: all 0.3s;
}
.news .newsmenu .fl h3:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 41px;
    width: 0px;
    height: 0px;
    background: #353535;
    z-index: -1;
    transition: all 0.3s;
}
.news .newsmenu .fl h4 {
    font-size: 18px;
    color: #6b6a6a;
    font-family: 'Futura';
}
.news .newsmenu .fr {}
.news .newsmenu .fr a {
    display:block;
    float:left;
    font-size: 15px;
    border: solid 1px #f1f1f1;
    margin-top: 10px;
    margin-left: 10px;
    text-align: center;
    width: 100%;
    width: 120px;
    font-style: normal;
    line-height: 36px;
    border-radius: 25px;
    color: #fff;
}
.news .newsmenu .fr a:hover {
    border: solid 1px #fede7c;
    background: #fede7c;
    color:#000;
}

.news .news-content {
}
.news .news-content ul {}
.news .news-content ul li {
    float:left;
    width:33.3%;
    padding: 45px 45px;
    border-right: 1px dashed #4a4a4a;
    position: relative;
    visibility: visible;
    animation-name: fadeInUp;
}
.news .news-content ul li:nth-of-type(1) {
	animation-delay: 0.4s;
}
.news .news-content ul li:nth-of-type(2) {
	animation-delay: 0.8s;
}
.news .news-content ul li:nth-of-type(3) {
	animation-delay: 1.2s;
}
.news .news-content ul li:nth-child(3n+1) {
    border-left: 1px dashed #4a4a4a;
}
.news .news-content ul li time {
    display:block;
    font-size: 24px;
    color: #1f1f1f;
    font-family: 'Futura';
    margin-bottom: 36px;
    transform: translate(0px,-100px);
    transition: all 0.5s;
}
.news .news-content ul li h4 {
    font-size:16px;
    color: #ffffff;
    height:68px;
    position: relative;
    text-indent: 1em;
}
.news .news-content ul li h4:after {
    content: "";
    position: absolute;
    left: 0px;
    top: -8px;
    width: 2%;
    height: 50px;
    background: #848484;
    z-index: -1;
    transition: all 3s;
}
.news .news-content ul li:hover h4:after {
    width: 100%;
}
.news .news-content ul li p{
    height:48px;
	margin-bottom:20px;
    font-size:12px;
    color: #bbb;
	overflow:hidden; 

	text-overflow:ellipsis;
	display:-webkit-box; 
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
}
.news .news-content ul li .pic {
    width:100%;
    height:195px;
    overflow:hidden;
}
.news .news-content ul li .pic img {
    transition: all 1s;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.news .news-content ul li span {
    display:block;
    width: 100%;
    height:40px;
    line-height: 38px;
    font-size: 12px;
    color: #d8d3d3;
    margin: 40px 0 0 10px;
    position: relative;
    transition: all 1s;
}
.news .news-content ul li span i {
	display:inline-block;
	width: 0px;
	height: 1px;
	background: #fede7c;
	margin-right:8px;
	transform: translate(0px,-5px);
	transition: all 0.5s;
}
.news .news-content ul li:hover span i {
    width:80px;
}

.news .news-content ul li:hover time {
	color:#ccc;
	transform: translate(0px,0px);
}
.news .news-content ul li:hover {
	/* background: url(../images/home-about-bg.png) no-repeat center center; */
	box-shadow: 0 20px 20px rgba(0,0,0,.1);
	/* background: #333; */
}
.news .news-content ul li:hover p{
    color: #f7f7f7;
}
.news .news-content ul li:hover .pic img {
    -webkit-transform: scale(1.05);transform: scale(1);
}