﻿.banner.index>.pc-720, .banner.index .BannerShow_b1, .banner.index .BannerShow_b1>div, .banner.index .BannerShow_b1 img, .banner.index .BannerShow_b1 a { height: 100%; }
.banner.index { height: calc(100vh - 90px); }
/*i1*/
.i1 { position: relative; z-index: 0; width: 100%; padding: 9% 0 3%; overflow: hidden;}
.i1>.img { position: absolute; top: 0; left: 0; width: 53.6%; z-index: -1; }
.i1:after { content: ''; width: 22.5vw; position: absolute; z-index: -1; height: 21.5vw; background: url(../images/bg2.png) no-repeat top right; right: 0; bottom: -28%; background-size: 100% auto; }
.i1 .T { width: 34%; margin-left: auto; padding-right: 8%; position: relative; z-index: 0; padding-left: 4.4%; padding-bottom: 8%; }
.i1 .T:before { content: 'about us'; text-transform: uppercase;  font-size: 6.25vw; color: #f6f6f6; position: absolute; z-index: -1; left: 0; top: -17%; }
.i1 .T:after { right: 0; content: ''; position: absolute; z-index: -1; width: 16.77vw; height: 26vw; background: url(../images/bg1.png) no-repeat right bottom; background-size: 100% auto; bottom: -6%; }
.i1 .T>h3 { font-size: 2.1vw; color: #46456e; }
.i1 .T>span { font-size: 1.7vw; color: #46456e; display: block; margin-top: 5px; }
.i1 .T>p { line-height: 2.25; font-size: 16px; color: #666; margin: 7% 0; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; max-height: 180px; }
.i1 .B { position: relative; z-index: 0; margin-left: 8%; width: 92%; font-size: 0;     display: none;}
.i1 .B .R { text-transform: capitalize; box-sizing: border-box; padding: 3.5%; text-align: center; width: 50.5%; color: #fff; background: #46456e; border-bottom: 4px solid #ffcb00; overflow: hidden; }
.i1 .B .R span { font-size: 2.6vw; }
.i1 .B .R b { font-size: 18px; margin-left: 15px; }
.i1 .B .R dt { font-size: 0.7vw; margin-top: 10px; }
.i1 .B dl { text-align: left; display: inline-block; margin-left: 10%; vertical-align: top; }
.i1 .B .L { font-size: 0; color: #fff; width: 49.5%; }
.video-click { color: #fff; cursor: pointer;display: none; }
.video-click i { transition: 0.3s ease 0s; width: 46px; height: 46px; line-height: 42px; text-align: center; border: 2px solid #fff; border-radius: 50%; box-sizing: border-box; }
.video-click i:before { transition: 0.3s ease 0s; content: ''; display: inline-block; vertical-align: middle; width: 0; height: 0; border-style: solid; border-color: transparent transparent transparent #fff; border-width: 11px 0 11px 18px; border-radius: 3px; }
.video-click span { font-size: 20px; margin-left: 15px; }
.i1 .B dl:first-child { margin-left: 0; }
.video { position: fixed; width: 100%; height: 100%; z-index: 2; left: 0; top: 0; text-align: center; display: none; }
.video video { width: 100%; font-size: 14px; color: #fff; position: relative; z-index: 0; height: 100%; background: #000; }
.video .close{ cursor:pointer; outline:none;position:absolute; z-index:1; width:30px; height:30px; background:#fff; right:2%; top:5%; opacity:0.5; transition:0.3s ease 0s;}
.video .close:before,.video .close:after{content:''; width:26px; height:2px; background:#333; position:absolute; left:50%; top:50%; margin-left:-13px; margin-top:-1px;}
.video .close:before{transform:rotateZ(45deg);}
.video .close:after{transform:rotateZ(-45deg);}

/*i2*/
.i2 .i-title+p { font-size: 18px; color: #666; margin-top: 1.5%; line-height: 1.5; }
.i2 .i-title+p strong { color: #444; }
.i2 .T { position: relative; margin-top: 4%; padding-top: 3%; z-index: 0; }
.i2 .T:before { content: 'product'; text-transform: uppercase; font-size: 6.25vw; color: #f6f6f6; position: absolute; z-index: -1; left: 0; top: 0; line-height: 1; }
.i2 .T ul { margin-top: 2.5%; box-sizing: border-box; font-size: 0; display: flex; flex-wrap: wrap; text-transform: uppercase; border: 1px solid #dfdfdf; }
.i2 .T li a, .i2 .T li i { display: block; width: 100%; }
.i2 .T li { display: inline-block; vertical-align: top; text-align: center; width: 25%; }
.i2 .T li h3 { transition: 0.3s ease 0s; font-size: 18px; color: #333; font-weight: normal; }
.i2 .T li a.on h3, .i2 .T li a.on:hover h3 { color: #333; }
.i2 .T li p { font-size: 12px; color: #888; margin-top: 5px; }
.i2 .T li i { font-size: 0; height: 6vw; margin-bottom: 10px; }
.i2 .T li i:before { content: ''; display: inline-block; vertical-align: middle; width: 0; height: 100%; }
.i2 .T li img { max-height: 100%; }
.i2 .T li a { height: 100%; box-sizing: border-box; padding: 9% 0; border-left: 1px solid #dfdfdf; background: #fff; position: relative; z-index: 0; }
.i2 .T li:first-child a { border-left: none; }
.i2 .T li a:before { transition: 0.3s ease 0s; content: ''; position: absolute; z-index: -1; height: 100%; width: 0; background: #efefef; top: 0; right: 0; }
.i2 .T li a.on:before { left: 0; width: 100%; }
.ProductList_b1 h3 { font-size: 20px; color: #444; font-weight: normal; margin-top: 5%; }
.ProductList_b1 .picimg:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; width: 0; }
.i2 .B { background: #efefef; padding: 3% 0 4%; }
.ProductList_b1 { width: 100%; }
.ProductList_b1 .picimg { overflow: hidden; width: 100%; height: 22vw; font-size: 0; background: #fff; position: relative; z-index: 0; }
.ProductList_b1 li a { box-sizing: border-box; overflow: hidden; text-align: center; display: block; position: relative; z-index: 0; }
.ProductList_b1 .picimg:after { content: ''; position: absolute; width: 100%; height: 100%; z-index: 1; transition: 0.3s ease 0s; border: 1px solid #ffcb00; box-sizing: border-box; opacity: 0; left: 0; top: 0; }
/*.ProductList_b1 li a:before, .ProductList_b1 .picimg:after { content: ''; position: absolute; width: 0; height: 0; z-index: 1; transition: 0.3s ease 0s; }
.ProductList_b1 li a:before { border-top: 1px solid #ffcb00; border-left: 1px solid #ffcb00; top: 0; left: 0; }
.ProductList_b1 li a:after { border-bottom: 1px solid #ffcb00; border-right: 1px solid #ffcb00; bottom: 0; right: 0; }*/
.ProductList_b1 img { transition: 0.5s linear 0s; max-width: 100%; display: inline-block; vertical-align: middle; max-height: 100%; }
.i2 .B .w-84 { position: relative; z-index: 0; }
.public-btn { margin-top: 3%; font-size: 0; text-align: center; }
.public-btn a { opacity: 0.7; font-size: 16px; font-weight: bold; font-family: "宋体"; width: 30px; height: 30px; display: inline-block; vertical-align: middle; text-align: center; line-height: 30px; background: #ffcb00; border-radius: 50%; color: #46456e; transition: 0.3s ease 0s; }
.public-btn span { outline: none; display: inline-block; width: 20px; font-size: 20px; color: #333; height: auto; border-radius: 0; background: none; opacity: 1; margin: 0 20px; vertical-align: top; }
.public-btn .swiper-pagination-bullet-active { border-bottom: 1px solid #ffcb00; color: #ffcb00; }
.public-btn .swiper-pagination { position: static; display: inline-block; vertical-align: middle; font-size: 0; }
.public-btn span:first-child { margin-left: 0; }
.public-btn span:last-child { margin-right: 0; }
.public-btn a:first-child { margin-right: 35px; }
.public-btn a:last-child { margin-left: 35px; }
.ProductList_b1 .page, .ProductList_b1 li span { display: none; }
/*i3*/
.i3 .B { width: 92%; position: relative; z-index: 0; top: 0; margin-top: 1.5%; }
.i3 .B:before { content: 'product'; text-transform: uppercase;font-size: 6.25vw; color: #f6f6f6; position: absolute; z-index: -1; left: 0; top: 0; line-height: 0.8; }
.i3 .B .L { margin-bottom: 3%; color: #fff; background: #46456e; width: 45%; padding: 5% 4% 7% 9%; box-sizing: border-box; }
.i3 .B .L h3 { font-size: 1.4vw; font-weight: normal; }
.i3 .B .L p { font-size: 16px; line-height: 2.15; margin-top: 5%; display: -webkit-box; margin-bottom: 9%; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; max-height: 93px; }
.i3 .B li { font-size: 0; }
.i3 .B .R { width: 55%; }
.case-btn { position: absolute; width: 18%; text-align: center; font-size: 0; z-index: 1; bottom: 8%; right: 55%; }
.case-btn a:first-child { border-right: 1px solid #46456e; }
.case-btn a { transition: 0.3s ease 0s; width: 50%; display: inline-block; vertical-align: top; font-size: 24px; font-family: "宋体"; background: #ffcb00; font-weight: bold; box-sizing: border-box; color: #46456e; height: 4.1vw; line-height: 4.1vw; }
.i3 .B .i-title { left: 8%; top: 6%; position: absolute; z-index: 2; }
.i3 .T { line-height: 0.7; text-align: right; position: static; margin-right: 8%; width: 92%; font-size: 2.1vw; color: #333; z-index: 0; }
.i3 .T span:before { content: '0'; }
.i3 .T span { display: inline-block; vertical-align: top; }
.i3 { margin-top: 3.5%; }
.i3 .swiper-pagination-current { font-size: 6.25vw; color: #ffcb00; font-weight: bold; margin-top: 0; }
/*i4*/
.i4 { margin-top: 4%; }
.i4 .T:before { content: 'news'; text-transform: uppercase; font-size: 6.25vw; color: #f6f6f6; position: absolute; z-index: -1; left: 50%; top: 0; line-height: 0.8; transform: translateX(-50%); }
.i4 .T { position: relative; text-align: center; z-index: 0; font-size: 0; padding-top: 2.5%; }
.i4 .i-title { display: inline-block; vertical-align: top; }
.i4 .B { margin-top: 2.5%; }
#NewsList_a1 li a { display: block; width: 100%; }
#NewsList_a1 .newimg { height: 23vw; overflow: hidden; }
#NewsList_a1 img { transition: 0.5s linear 0s; width: 100%; height: 100%; }
#NewsList_a1 .newnr { padding: 9.5% 7% 7%; width: 80%; background: #fff; margin: -25% auto 0; box-sizing: border-box; border: 1px solid #dfdfdf; position: relative; z-index: 0; }
#NewsList_a1 .newnr>b { transition: 0.3s ease 0s; text-align: center; font-size: 26px; color: #333; white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis; }
#NewsList_a1 .data { font-size: 20px; color: #666; text-align: center; margin-top: 2%; }
#NewsList_a1 .newnr>p { font-size: 16px; color: #666; line-height: 2.1; display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; max-height: 91px; }
#NewsList_a1 .newnr:after { content: 'view more'; color: #ffcb00; text-transform: uppercase; display: block; text-align: center; font-size: 16px; margin-top: 8%; }
#NewsList_a1 .data:after { display: block; content: '//'; margin: 1% 0; }
/*i-title*/
.i-title:after { background: #ffcb00; bottom: 0; }
.i-title:before { top: 0; background: #46456e; }
.i-title:before, .i-title:after { height: 50%; width: 6px; content: ''; position: absolute; left: 0; }
.i-title b { display: block; font-size: 1.4vw; margin-top: 0.2vw; }
.i-title span { display: block; font-size: 1vw; }
.i-title>strong { font-size: 2.6vw; margin-right: 10px; }
.i-title { line-height: 1; color: #46456e; position: relative; z-index: 0; font-size: 0; padding-left: 2%; box-sizing: border-box; }
.i2 .B .w-84>div { position: absolute; width: 100%; opacity: 0; transform: scale(1, 0); transform-origin: top; top: 0; left: 0; }
.i2 .B .w-84>div.on { transition: transform 0s ease 0s, opacity 1s linear 0s; position: static; opacity: 1; transform: scale(1); }
.ProductList_b1 #load_more_button, #NewsList_a1 .page, #NewsList_a1 #load_more_button, .i-title>strong i { display: none; }
@media screen and (min-width: 1024px ) {
.ProductList_b1 a:hover .picimg:after { opacity: 1; }
.i2 .T li a:hover h3 { color: #46456e; }
.video-click:hover i { background: #fff; }
.video-click:hover i:before { border-color: transparent transparent transparent #ffcb00; }
.ProductList_b1 li a:hover:before, .ProductList_b1 li a:hover:after { width: 100%; height: 100%; }
.ProductList_b1 li a:hover img, #NewsList_a1 li a:hover img { transform: scale(1.2); }
.public-btn a:hover { opacity: 1; }
.public-btn a.left:hover { text-indent: -5px; }
.public-btn a.right:hover { text-indent: 5px; }
.case-btn a.left:hover { text-indent: -10px; }
.case-btn a.right:hover { text-indent: 10px; }
#NewsList_a1 li a:hover .newnr>b { color: #ffcb00; }
.video .close:hover{opacity:1;}
}
@media screen and (max-width: 1400px ) {
#NewsList_a1 .newnr>b { font-size: 20px; }
.i1 .T { padding-bottom: 5%; }
.video-click span, .i2 .T li h3, .ProductList_b1 h3, #NewsList_a1 .data { font-size: 16px; }
.i2 .i-title+p, .public-btn a, #NewsList_a1 .newnr:after { font-size: 14px; }
.video-click i { width: 38px; height: 38px; line-height: 34px; }
.video-click i:before { border-width: 8px 0 8px 14px; }
/*.i1 .B .R { width: 75.5%; }
.i1 .B .L { width: 24.5%; }*/
.i1 { padding: 7% 0 3%; }
.public-btn span { font-size: 16px; margin: 0 10px; }
.public-btn a:first-child { margin-right: 15px; }
.public-btn a:last-child { margin-left: 15px; }
.i3 .B .L p { font-size: 14px; line-height: 1.7; max-height: 65px; }
.case-btn { bottom: 8.3%; }
#NewsList_a1 .newnr>p { font-size: 14px; line-height: 1.7; max-height: 65px; }
}
@media screen and (max-width: 1200px ) {
.i1 .T { padding-bottom: 0; }
.i1 { padding: 10% 0; }
.i1>.img { width: 50%; }
.i1 .T { width: 37%; }
#NewsList_a1 .newnr>b { font-size: 18px; }
.i1 .B, .i1:after, .i1 .T:after { display: none; }
}
@media screen and (max-width: 1024px ) {
#NewsList_a1 .newnr { width: 90%; }
.i3 .B .L h3 { font-size: 18px; }
.pricesList_a1 h2, .i1 .T>span, #NewsList_a1 .newnr>b { font-size: 16px; }
.pricesList_a1 ul { padding: 5px 20px; margin-top: 10px; }
.pricesList_a1 { font-size: 14px; bottom: 2.5%; }
.i1 .T>h3 { font-size: 20px; }
.i3 .B .L p { -webkit-line-clamp: 2; max-height: 42px; }
.i3 .B .L { margin-bottom: 0; width: 50%; padding: 4% 4% 5% 9%; }
.i3 .B .R { width: 100%; }
#NewsList_a1 .data { font-size: 14px; }
.case-btn { right: 50%; bottom: 0; transform: translateX(50%); }
.i3 .B { width: 100%; margin-top: 0; }
.banner.index { height: calc(100vh - 55px); }
.i3 .B .L, .i3 .T { display: none; }
}
@media screen and (max-width: 720px ) {
.banner.index { height: auto; }
.pricesList_a1 h2 { display: inline-block; vertical-align: top; font-size: 3.33vw; padding: 0; border: none; }
.pricesList_a1 { background: #efefef; position: static; font-size: 0; bottom: 0; box-sizing: border-box; padding: 4vw 2.8%; }
.pricesList_a1 ul { font-size: 3.33vw; padding: 0; margin-top: 0; border: none; }
.pricesList_a1 b { margin: 0 2vw; }
.pricesList_a1 i { margin-left: 4vw; }
.i-title { padding-left: 5.2vw; line-height: normal; display: inline-block; vertical-align: top; }
.i-title>strong { margin-right: 0; font-size: 6.5vw; }
.i-title>strong i { display: inline-block; vertical-align: top; font-size: 6.5vw; margin-top: 0; font-weight: bold; }
.i1, .i2, .i3, .i4 { padding: 0; margin-top: 8vw; padding-bottom: 11vw; border-bottom: 5px solid #ededed; }
.i2 { text-align: center; }
.i2 .T:before, .i3 .B:before, .i4 .T:before { font-size: 16.6vw; color: #f6f6f6; left: 50%; transform: translateX(-50%); }
.i1>.img { width: 100%; position: relative; margin-top: 7vw; z-index: 0; }
.i1 .mob-720 { position: relative; text-align: center; z-index: 0; padding-top: 8vw; }
.i1 .mob-720:before { content: 'about'; text-transform: uppercase; font-size: 16.6vw; color: #f6f6f6; top: 0; left: 50%; transform: translateX(-50%); z-index: -1; position: absolute; }
.video-click { cursor: pointer; color: #f7f7f7; position: absolute; left: 10vw; bottom: 10vw; }
.video-click span { font-size: 4.4vw; margin-left: 2.5vw; }
.video-click i { width: 5.8vw; height: 5.8vw; line-height: 5.8vw; box-sizing: content-box; }
.video-click i:before { border-width: 1.6vw 0 1.6vw 2.4vw; }
.i1 .T { width: 94.4%; padding: 0; margin: 11vw auto 0; text-align: center; }
.i1 .T>h3 { font-size: 5.5vw; text-align: left; }
.i1 .T>span { font-size: 4.2vw; text-align: left; }
.i1 .T>p { line-height: 1.7; font-size: 4.4vw; margin: 5.5vw 0; max-height: none; text-align: left; margin-bottom: 8vw; }
.i2 .T .w-84 { width: 100%; }
.i2 .T { margin-top: 0; padding-top: 7%; }
.i2 .T ul { margin-top: 6.5%; }
.i2 .T li i { height: 10vw; margin-bottom: 2vw; }
.i2 .T li h3, .i2 .T li a.on h3 { font-size: 3.8vw; color: #444; }
.i2 .T li a { padding: 17% 0; }
.ProductList_b1 h3 { font-size: 3.8vw; }
.ProductList_b1 .picimg { height: 47vw; }
.public-btn span { border: none !important; font-size: 0; width: 8px; margin: 0 5px; height: 8px; background: #fff; border-radius: 50%; }
.public-btn .swiper-pagination-bullet-active { background: #46456e; }
.public-btn { margin-top: 6%; }
.i3 .B .i-title { left: 0; top: 0; position: relative; z-index: 2; margin-bottom: 8vw; }
.i3 .B { width: 94.4%; text-align: center; padding-top: 5vw; margin: 0 auto 8vw; }
.case-btn { width: 100%; top: 0; bottom: auto; }
.case-btn a { font-size: 4.4vw; height: 11vw; line-height: 11vw; border-bottom: 1px solid #fff; }
.i3 .swiper-container { padding-top: 11vw; }
.case-btn a:first-child { border-right: 1px solid #fff; }
.i3 .B .R { position: relative; z-index: 0; }
.i3 .B .R:before { content: attr(title); color: #fff; font-size: 4.4vw; position: absolute; width: 100%; left: 0; text-align: center; padding: 0 3vw; box-sizing: border-box; bottom: 7vw; }
.i3 .mob-720 { text-align: center; }
#NewsList_a1 .newnr { margin: 0; width: 100%; padding: 7vw 2.8%; border-left: none; border-right: none; border-bottom-width: 5px; }
.i4 .B ul { display: block; }
.i4 .T { padding-top: 5.5%; }
.i4 .B { width: 100%; margin-top: 5vw; margin-bottom: 8vw; }
#NewsList_a1 .newnr>b { font-size: 4.7vw; text-align: left; }
#NewsList_a1 .newnr>p { font-size: 4.4vw; line-height: 2; max-height: none; margin-top: 4vw; }
.i4 .B li:nth-child(1), .i4 .B li:nth-child(2), .i4 .B li:nth-child(3) { display: block; }
.i4 .mob-720 { text-align: center; }
.i4 { border: none; }
.i-footer .footer-box { margin-top: 0; }
.i2 .B { padding: 8vw 0; margin-bottom: 8vw; }
.video .close{top:5vw; right:5vw;}
.i-title b, .i-title span, .i1 .T:before, .i2 .i-title+p, .i2 .T li p, .public-btn a, #NewsList_a1 .newimg, #NewsList_a1 .newnr:after, #NewsList_a1 .data, .i4 .B li, .news-btn.public-btn { display: none; }
}
