/* CSS Document */

.smo,
.mo{ display: none !important; }

.pic > img{ 
	display:block; 
	width:100%; 
	transition:600ms; 
	-webkit-transition:600ms; 
	}
.pic2 > img{
	display:block; 
	width:100%; 
	}

/* slick */
.slick-slider { position: relative; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; height:calc(100% - 50px); margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; top: 0; left: 0; display: block; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
.slick-dots{ font-size:0; text-align:center; }
.slick-dots li{ width:12px; height:12px; border-radius:100%; margin:0 12px; display: inline-block;*zoom: 1;*display: inline; vertical-align:middle; transition: 300ms; -webkit-transition: 300ms;  }
.slick-dots li a{ display:block; width:100%; height:100%; background: #ddd; border-radius: 50%;}
.slick-dots li.slick-active a{ background: #0082c2;}
/* .slick-dots li.slick-active,.slick-dots li:hover{ background:#fff !important;  } */
/* slick end */


@keyframes scaleUpDown {
    from { -webkit-transform: scale(1.08); transform: scale(1.08); }
    to { -webkit-transform: scale(1); transform: scale(1); }
} 
@keyframes fadeInUp { 
	from { opacity: 0; transform: translate3d(0, 60px, 0); }
    to { opacity: 1; transform: none; }
} 
@keyframes lightSpeedIn { 
	from { transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; }
	60% { transform: skewX(20deg); opacity: 1; }
	80% { transform: skewX(-5deg); opacity: 1; }
	to { transform: none; opacity: 1; }
} 
@keyframes fadeInDown { 
	from { opacity: 0; transform: translate3d(0, -60px, 0); }
    to { opacity: 1; transform: none; }
} 
@keyframes fadeInRight { 
	from { opacity: 0; transform: translate3d(60px, 0, 0); }
    to { opacity: 1; transform: none; }
} 
@keyframes fadeInLeft { 
	from { opacity: 0; transform: translate3d(-60px, 0, 0); }
    to { opacity: 1; transform: none; }
} 
@keyframes reveal-v {
  0% { transform: scaleY(0); }
  50% { transform: scaleY(1); transform-origin: 0% 0% 0px; }
  51% { transform-origin: 50% 100% 0px; }
  100% { transform: scaleY(0); transform-origin: 50% 100% 0px; } 
} 
@keyframes reveal-l {
  0% { transform: scaleX(0); }
  50% { transform: scaleX(1); transform-origin: 0% 0% 0px; }
  51% { transform-origin: 100% 50% 0px; }
  100% { transform: scaleX(0); transform-origin: 100% 50% 0px; } 
} 

/* animation end */
@media screen and (min-width:1153px){

.active .am-rol{ animation: rollIn 1s ease-out; }
.active .am-lsi { animation: lightSpeedIn 1000ms both; }
.active .am-fiu { animation: fadeInUp 800ms both; }
.active .am-fid { animation: fadeInDown 800ms both; }
.active .am-fir { animation: fadeInRight 800ms both; }
.active .am-fil { animation: fadeInLeft 800ms both; }
.active .am-rvv{ position: relative; /* display: inline-block; vertical-align: bottom; */ /* 文字加上 */ }
.active .am-rvv:before{ content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: #000; transform: scaleY(0); transform-origin: 0% 0% 0px; animation: reveal-v 2s 200ms cubic-bezier(0, 0, 0.2, 1) both; }
.active .am-rvl{ position: relative; /* display: inline-block; vertical-align: bottom; */ /* 文字加上 */ }
.active .am-rvl:before{ content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: #000; transform: scaleX(0); transform-origin: 0% 0% 0px; animation: reveal-l 2s 200ms cubic-bezier(0, 0, 0.2, 1) both; }
.active .am-delay-1 { animation-delay: 100ms; }
.active .am-delay-2 { animation-delay: 200ms; }
.active .am-delay-3 { animation-delay: 300ms; }
.active .am-delay-4 { animation-delay: 400ms; }
.active .am-delay-5 { animation-delay: 500ms; }
.active .am-delay-6 { animation-delay: 600ms; }
.active .am-delay-7 { animation-delay: 700ms; }
.active .am-delay-8 { animation-delay: 800ms; }
.active .am-delay-9 { animation-delay: 900ms; }
.active .am-delay-10 { animation-delay: 1000ms; }
.active .am-delay-11 { animation-delay: 1100ms; }
.active .am-delay-12 { animation-delay: 1200ms; }
} /* 1153 */
@keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:none;transform:none}}


.banner-box { overflow: hidden; position: relative; }
.banner-box .banner { position: relative; color: #fff; }
.banner-box .banner .avi-btn { display: none; }
.banner-box .banner a { color: #fff; }
.banner-box .banner .item { position: relative; overflow: hidden; }
.banner-box .banner .item .picbox { margin: 0 60px; height: 100%; overflow: hidden; }
.banner-box .banner .item .vi, .banner-box .banner .item .pic2 {position: absolute;top: 0; object-fit: cover !important;ect-fit:;left: 0;}
.banner-box .banner .item.slick-current .pic img, .banner-box .banner .item.slick-current .pic2 img { animation: scaleUpDown 5s forwards cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.banner-box .banner .item .bt-name { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 5%; }
.banner-box .banner .item .pic { position: absolute; bottom: 50%; right: 0; margin-bottom: -56px; width: 240px; height: 112px; overflow: hidden; }
.banner-box .banner .item .pic:before { content: ""; z-index: 1; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url("../images/black.png"); background: rgba(0, 0, 0, 0.2); }
.banner-box .banner .item .pic img { transition: none; }
.banner-box .banner .item .txts { position: absolute; left: 60px; right: 60px; bottom: 50%; padding: 0 5%; margin-bottom: -56px; }
.banner-box .banner .item .txts .b { position: relative; }
.banner-box .banner .item .txts .tx1 { text-shadow: 1px 1px 1px rgba(0,0,0,.5); margin-bottom: 15px; font-size: 24px;}
.banner-box .banner .item .txts .tx2 { text-shadow: 1px 1px 1px rgba(0,0,0,.5); font-size: 50px; line-height: 112px; font-weight: bold; white-space: nowrap; overflow: hidden; }
.banner-box .banner .item .txts .line, .banner-box .banner .item .txts:after { bottom: 56px; height: 1px; }
.banner-box .banner .item .txts:after { content: ""; position: absolute; left: -60px; width: 110px; background: #0082c2; }
.banner-box .banner .item .txts .line { position: absolute; width: 37%; right: 225px; background: #fff; display: none; }
.banner-box .banner .item .txts .line:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: #00ba9a; }
.banner-box .banner .item .txts .ixmore { position: absolute; left: 0; bottom: -120px; text-align: left; }
.banner-box .banner .item.active .txts .line:before { width: 100%; transition: 5800ms linear; }
.banner-box .banner .item.first-active .txts .line:before { transition: 4800ms linear; }
.banner-box .banner .slick-dots { position: absolute; left: 0; right: 0; bottom: 14px; }
.banner-box .banner .slick-dots li { position: relative; margin: 0 22px; }
.banner-box .banner .slick-dots li:before { content: ""; position: absolute; left: 50%; top: -45px; height: 0; width: 1px; background: #0082c2; transition: 800ms; }
.banner-box .banner .slick-dots li.slick-active:before, .banner-box .banner .slick-dots li:hover:before { height: 40px; }
.banner-box .banner .slick-next { position: absolute; right: 0; bottom: 50%; margin-bottom: -36px; width: 240px; height: 112px; }
.banner-box .banner .slick-next .nowti {text-shadow: 1px 1px 1px rgba(0,0,0,.5); position: absolute; left: 15px; right: 15px; top: 25%; height: 24px; line-height: 24px; font-size: 20px; text-transform: capitalize; }
.banner-box .banner .slick-next .lr-arrow { position: absolute; right: 30px; bottom: 20%; }



@media screen and (max-width: 1024px) { 
.banner{ padding: 0px;}
  .banner-box .banner .item .picbox { margin: 0 ; }
  .banner-box .banner .item .pic2 { position: static; }
  .banner-box .banner .item .pic { display: none; }
  .banner-box .banner .item .bt-name { padding: 0; }
  .banner-box .banner .item .txts { color: #000; position: static; margin: 0; padding: 0px;}
  .banner-box .banner .item .txts:after, .banner-box .banner .item .txts .line { display: none; }
  .banner-box .banner .item .txts .ixmore { margin-top: 40px; position: static; }
  .banner-box .banner .item .txts .ixmore .ib { border-color: #a0a0a0; }
  .banner-box .banner .item .txts .ixmore .ib .bico {}
  .banner-box .banner .item .txts .tx1 { margin-bottom: 15px; }
  .banner-box .banner .item .txts .tx2 { line-height: 1; text-overflow: ellipsis; }
  .banner-box .banner .item .txts .b { padding: 35px 5% 50px 5%; border-bottom: 1px solid #ccc; }
  .banner-box .banner .slick-next { display: none !important; }
  .banner-box .banner .slick-dots { text-align: right; padding: 0 10%; }
  .banner-box .banner .slick-dots li { margin-right: 0; }
  .banner-box .banner .slick-dots li:before { display: none; }
  .banner-box .banner .item .txts .b{ padding: 20px 5%;}
  .banner-box .banner .item .txts .tx1{ font-size: 18px;}
  .banner-box .banner .item .txts .tx2{ font-size: 30px;}
}