@charset "utf-8";
/* CSS Document */
.banner_area{ overflow: hidden; margin:110px 3% auto 3%; position: relative;}
.banner_slogin{ position: absolute; right: 8%; top: 30px; z-index: 99; color: #FFF; font-size: 55px; font-weight: 700; line-height: 1.5; padding-top: 1%;text-shadow: 2px 2px 5px rgba(0, 0, 0, .3);}
.banner_slogin .color01{ color: var(--blue);}
.banner_slogin .color02{ color: var(--green);}

.banner_area .item { margin-top:30px; position: relative;}
.banner_area .item .cover { position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.banner_area .item .cover .info-content { position: relative; display: flex; align-items: flex-end; justify-content: flex-start;}
.banner_area .item .cover .info-content .pro_photo { margin-left: 10%;}
.banner_area .item .cover .info-content .pro_photo img { display: block; max-width: 100%!important; height: auto; }
.banner_area .item .cover .info-content .text { font-size: 28px; line-height: 36px; font-weight: 500; color: #000; max-width: 760px; width: 100%; margin-bottom: 8%;}
.banner_area .owl-item.active .text {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInDown;
  animation-delay: 0.3s;
}
.banner_area .owl-item.active .pro_photo {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInLeft;
  animation-delay: 0.3s;
}
.banner_area .owl-nav .owl-prev {
  position: absolute;
  left: 3%;
  top: 43%;
  opacity: 0;
  -webkit-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
  background: rgba(0, 0, 0, 0.5) !important;
  width: 40px;
  cursor: pointer;
  height: 40px;
  position: absolute;
  display: block;
  z-index: 1000;
  border-radius: 0;
}
.banner_area .owl-nav .owl-prev span {
  font-size: 1.6875rem;
  color: #fff;
}
.banner_area .owl-nav .owl-prev:focus {
  outline: 0;
}
.banner_area .owl-nav .owl-prev:hover {
  background: #000 !important;
}
.banner_area .owl-nav .owl-next {
  position: absolute;
  right: 3%;
  top: 43%;
  opacity: 0;
  -webkit-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
  background: rgba(0, 0, 0, 0.5) !important;
  width: 40px;
  cursor: pointer;
  height: 40px;
  position: absolute;
  display: block;
  z-index: 1000;
  border-radius: 0;
}
.banner_area .owl-nav .owl-next span {
  font-size: 1.6875rem;
  color: #fff;
}
.banner_area .owl-nav .owl-next:focus {
  outline: 0;
}
.banner_area .owl-nav .owl-next:hover {
  background: #000 !important;
}
.banner_area:hover .owl-prev {
  left: 0px;
  opacity: 1;
}
.banner_area:hover .owl-next {
  right: 0px;
  opacity: 1;
}

/****/
@media all and (max-width: 1800px) {
	.banner_area .item .cover{ top: 5%;}
	.banner_area .item .cover .info-content .pro_photo img { max-width: 86%!important;}
}
@media all and (max-width: 1630px) {
	.banner_area .item .cover .info-content .pro_photo img { max-width: 80%!important;}
}
@media all and (max-width: 1536px) {
	.banner_area .item .cover .info-content .pro_photo img { max-width: 76%!important;}
	.banner_area .item .cover .info-content .text{ margin-left: -100px;}
}
@media all and (max-width: 1440px) {
	.banner_area .item .cover .info-content .pro_photo img { max-width: 70%!important;}
	.banner_area .item .cover .info-content .text{ margin-left: -150px; font-size: 24px;}
}
@media all and (max-width: 1366px) {
	.banner_area .item .cover .info-content .pro_photo img { max-width: 66%!important;}
}
@media all and (max-width: 1280px) {
	.banner_slogin{ font-size: 50px; line-height: 1.2; top: 50px;}
	.banner_area .item{ margin-top: 40px;}
}
@media all and (max-width: 1024px) {
	.banner_area{ overflow: hidden; margin:110px 1.5% auto 1.5%; position: relative;}
}
@media all and (max-width: 991px) {
	.banner_area{ margin-top:80px;}
	.banner_slogin { font-size: 40px; line-height: 42px; right: 2%;}
	.banner_area .item .cover .info-content{ align-items: center; flex-direction: column; text-align: left; width: 54%; margin-left: 3%; }
	.banner_area .item .cover .info-content .pro_photo, .banner_area .item .cover .info-content .text{ margin-left: inherit;}
	.banner_area .item .cover .info-content .text{ margin-bottom: 0px; font-size: 18px; line-height: 24px; max-width: inherit; margin-left: inherit;}
	.banner_area .item .cover .info-content .pro_photo{ max-width: inherit;}
	.banner_area .item .cover .info-content .pro_photo img{ max-width: 100%; margin: auto auto auto 0px;}
	.banner_area .item .cover{ top: 0%; padding-top: 10%;}
		
}
@media all and (max-width: 640px) {
	.banner_slogin{ font-size: 34px; line-height: 38px;}
}
@media all and (max-width: 600px) {
	.banner_area .item .cover .info-content .text br{ display: none;}
	.banner_slogin { font-size: 30px; line-height: 34px;}
}
@media all and (max-width: 540px) {
	.banner_area .item .cover .info-content .text{ font-size: 15px; line-height: 20px;}
}
@media all and (max-width: 480px) {
.banner_slogin{ font-size: 26px; line-height: 30px;}
}
@media all and (max-width: 414px) {
	.banner_slogin{ font-size: 20px; line-height: 22px;}
	.banner_area .item .cover{ padding-top: 2%;}
	.banner_area .item .cover .info-content{ width: 60%;}
	.index_appilication_area{ padding-top: 5%;}
}

@media all and (max-width: 393px) {
	.banner_area{margin-top: 70px;}
	.banner_area .item .cover{padding-top: 0%; top: -10px;}
	.banner_area .item .cover .info-content{ width: 63%;}
	.banner_slogin{font-size: 17px; line-height: 20px;}
}
@media all and (max-width: 384px) {
	.banner_area .item .cover .info-content{ width: 65%;}
}
@media all and (max-width: 375px) {
	.banner_area .item .cover{top: -30px;}
}
@media all and (max-width: 344px) {
	.banner_area .item .cover .info-content{width: 72%;}
	.banner_slogin{ text-align: right; font-size: 16px;}
	.banner_slogin br:nth-child(1){ display: none;}
	.banner_area .item{margin-top: 50px;}
}
@media all and (max-width: 280px) {
	.banner_area{margin-top: 60px;}
	.banner_area .item .cover .info-content .text{ font-size: 70%; line-height: 18px;}
}
@media all and (max-width: 240px) {
	.banner_slogin{font-size: 15px;line-height: 16px;}
	.banner_area .item{margin-top: 40px;}
	.banner_area .item .cover .info-content{ width: 60%;}
}