@import "https://fonts.googlefonts.cn/css?family=Exo:600,700|Roboto:400,500,700&display=swap";
* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box
}
body, div, dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6, pre, code,
form, fieldset, legend, input, button,
textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
	}
fieldset, img {
    border: 0;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}
a{ text-decoration:none;}
address, caption, cite, code, dfn,
em, strong, th, var, optgroup {
    font-style: normal;
    font-weight: normal;
}
h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
}
abbr, acronym {
    border: 0;
    font-variant: normal;
}
button {
	overflow:visible
}
button, select {
	text-transform:none
}
button, html input[type=button], input[type=reset], input[type=submit] {
	-webkit-appearance:button;
	cursor:pointer
}
button[disabled], html input[disabled] {
	cursor:default
}
button::-moz-focus-inner, input::-moz-focus-inner {
padding:0;
border:0
}
input, button, textarea,
select, optgroup, option {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
}
input {
	line-height:normal
}
input[type=checkbox], input[type=radio] {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding:0
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
height:auto
}
input[type=search] {
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
	-webkit-appearance:textfield
}
input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
-webkit-appearance:none
}

code, kbd, samp, tt {
    font-size: 100%;
}
ol, ul { list-style: none; }
/*@purpose To enable resizing for IE */
/*@branch For IE6-Win, IE7-Win */
input, button, textarea, select {
    font-size: 100%;
}

:after, :before {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
body{
	position:relative;
	font-family:"Roboto", sans-serif;
	font-weight:500;
	font-display:"swap";
	font-size:1.6rem;
	background-color:#fff;
	color:#32302d;
	line-height:1.5em;
	}
html{
	font-size:10px;
	}

/*公共代码*/
:root{
	--web-theme-color:#267d98;
	--web-theme-color-black:#32302d;
	--web-theme-color-white:#ffffff;
	--web-theme-color-gray:#737373;
	--web-theme-color-red:#d1291c;
	--web-theme-color-blue:#174d5e;
	--web-theme-color-yellow:#f7bd00;
	
}
section{
	padding:8rem 0;
	}
.wrap-flex{
	 display: -webkit-flex; 
  	display: flex;
}
.wrap-flex-1{
	 display: -webkit-flex; 
  	display: flex;
}
.grid{
	display: -webkit-grid; 
  display: grid;
}
.grid-1{
	display: -webkit-grid; 
  display: grid;
}
.mt3{ margin-top:4rem;}

/*form-group*/
/*page-cneter*/
.text-center {
	text-align:center
}

/*clearflot*/
.btn-group-vertical>.btn-group:after, .btn-group-vertical>.btn-group:before, .btn-toolbar:after, .btn-toolbar:before, .clearfix:after, .clearfix:before, .container-fluid:after, .container-fluid:before, .container:after, .container:before, .dl-horizontal dd:after, .dl-horizontal dd:before, .form-horizontal .form-group:after, .form-horizontal .form-group:before, .modal-footer:after, .modal-footer:before, .modal-header:after, .modal-header:before, .nav:after, .nav:before, .navbar-collapse:after, .navbar-collapse:before, .navbar-header:after, .navbar-header:before, .navbar:after, .navbar:before, .pager:after, .pager:before, .panel-body:after, .panel-body:before, .row:after, .row:before {
	display:table;
	content:" "
}
.btn-group-vertical>.btn-group:after, .btn-toolbar:after, .clearfix:after, .container-fluid:after, .container:after, .dl-horizontal dd:after, .form-horizontal .form-group:after, .modal-footer:after, .modal-header:after, .nav:after, .navbar-collapse:after, .navbar-header:after, .navbar:after, .pager:after, .panel-body:after, .row:after {
	clear:both
}
.form-control::-moz-placeholder {
color:#fff;
opacity:1
}
.form-control:-ms-input-placeholder {
color:#fff;
}
.form-control::-webkit-input-placeholder {
color:#fff;
}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
	background-color:#fff;
	opacity:1
}
/*input-group-btn */
.input-group-btn {
	position:relative;
	font-size:1em;
	white-space:nowrap
}
.input-group-btn>.btn:active, .input-group-btn>.btn:focus, .input-group-btn>.btn:hover {
	z-index:2
}
.input-group-btn:first-child>.btn, .input-group-btn:first-child>.btn-group {
	margin-right:1px
}
.input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group {
	z-index:2;
	margin-left:-12px
}



/*nycer*/
img {
	vertical-align:middle
}
.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img {
	display:block;
	max-width:100%;
	height:auto
}
.thumbnail {
	display:block;
	padding:4px;
	margin-bottom:20px;
	line-height:1.42857143;
	background-color:#fff;
	border:1px solid #ddd;
	border-radius:4px;
-webkit-transition:border .2s ease-in-out;
-o-transition:border .2s ease-in-out;
transition:border .2s ease-in-out
}
.thumbnail a>img, .thumbnail>img {
	margin-right:auto;
	margin-left:auto;
}
a.thumbnail.active, a.thumbnail:focus, a.thumbnail:hover {
	border-color:#337ab7
}
.thumbnail .caption {
	padding:9px;
	color:#333
}


/*font*/

h1{
	font-family:"Exo", sans-serif; 
	font-display:"swap";
	font-size:6rem;
	color:#fff;
	font-weight:700;
	}	
h2{
	font-family:"Exo", sans-serif; 
	font-display:"swap";
	font-size:4.8rem;
	font-weight:700;
	text-transform:capitalize;
	text-align:center;
	line-height:1.2em;
	color:var(--web-theme-color); 
	}	
h3{
	font-family:"Exo", sans-serif; 
	font-display:"swap";
	font-size:2.4rem;
	font-weight:600;
	}
h4{
	font-size:1.8rem;
}															
p{color:var(--web-theme-color-gray); line-height:1.8em;}

/*button*/
.more  {
  display: inline-block;
  vertical-align: middle;
   padding:1.5rem 4rem; 
  margin-left:2rem;
  font-size:1.2em; 
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
    background-color:#fff;
	border:var(--web-theme-color-yellow) solid 2px;
	text-align:center;
	color: #333;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.more i{font-size:2rem; -webkit-text-stroke: 1px var(--web-theme-color) none;color: var(--web-theme-color);}
.more:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color:rgba(255,255,255,.1);
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.more:hover, .more:focus, .more:active {
  color: var(--web-theme-color);
}
.more:hover i, .more:focus i, .more:active i {
  color: var(--web-theme-color);
}
.more:hover:before, .more:focus:before, .more:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
/*-------
common
-------*/
.sy-container{
	padding-right:15px;
	padding-left:15px;
	margin-right:auto;
	margin-left:auto;
	width:100%;
	max-width:1800px;
}
.sy-img-responsive, .sy-thumbnail a>img, .sy-thumbnail>img {
	display:block;
	max-width:100%;
	height:auto
}
.sy-center-block {
	display:block;
	margin-right:auto;
	margin-left:auto
}
.sy-rounded{ border-radius:20px;}
.combg{ background-color:#f2f7f9;}
.com-title{ width:20rem; background-color:var(--web-theme-color-yellow); margin:0 auto; padding:8px 3rem; font-size:2rem; text-align:center; white-space:nowrap; color:var(--web-theme-color-white);}
/*button-new*/
.com-more-1 .more{ margin-left:0; border-radius:35px; color:var(--web-theme-color-black);}
.com-more-1 .more i{ margin-left:2rem;color:var(--web-theme-color-black);}
.com-more-1 .more:hover, .com-more-1 .more:focus, .com-more-1 .more:active {
  border-radius:35px;	
  	border:none;
	background-color: var(--web-theme-color);
  color: var(--web-theme-color-white);
}
.com-more-1 .more:hover i, .com-more-1 .more:focus i, .com-more-1 .more:active i {
  color: var(--web-theme-color-white);
}
.com-more-1 .more:hover:before, .com-more-1 .more:focus:before,.com-more-1 .more:active:before {
	border-radius:35px;
	border:none;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
/*------
company info
--------*/
#company-info{ position:relative; padding-bottom:8rem;}
.company-infobg{ position:absolute;left:0; top:0; background:url(../images/index/about/company-infobg.webp) no-repeat; width:100%; height:100%; background-size:cover;}
#company-info .sy-container{ position:relative; z-index:5;}
#company-info .grid{grid-template-columns:repeat(4,24%); justify-content: center; padding-top:8rem;} 
#company-info .wrap-flex{ justify-content: center;}
#company-info h2{ text-align:center; line-height:1.6em; color:#fff;}
#company-info  p{ text-align:center; color:rgba(255,255,255,.6);}
/* -------------------------------- 

Modules - reusable parts of our design

-------------------------------- */
/*------------------------------------------------------------------index-page---------------------------------------------------*/
footer .grid{ padding-bottom:4rem; grid-template-columns:repeat(2,auto); align-items: center; border-bottom:rgba(255,255,255,.4) solid 1px; justify-content: space-between;}
footer  h2{ text-align:left; color:var(--web-theme-color-white);}
.index-seek-title p { padding-top:2rem;  color:rgba(255,255,255,.6);}
footer  .form-control {
	display:block;
	position:relative;
	width:30vw;
	height:50px;
	padding:12px 2rem;
	border-radius:35px;
	border:rgba(255,255,255,0.6) solid 1px;
	line-height:1.42857143;
	background-color:transparent !important;
}
footer  .form-control:focus {
	border-color:var(--web-theme-color-white) !important;
	outline:0;
	-webkit-box-shadow:inset 0 1px 1px rgba(255, 255, 255, .075), 0 0 8px rgba(255, 255, 255, .6);
	box-shadow:inset 0 1px 1px rgba(255, 255, 255, .075), 0 0 8px rgba(255, 255, 255, .6);
}
footer  .form-control::-moz-placeholder {
color:rgba(255,255,255,.6);
}
footer .form-control:-ms-input-placeholder {
color:rgba(255,255,255,.6);
}
footer  .form-control::-webkit-input-placeholder {
color:rgba(255,255,255,.6);
}
footer  button {
	position:relative;
	z-index:5;
	margin-left:-16rem;
	margin-top:8px;
	display:inline-block;
	width:14rem;
	height:35px;
	padding:6px 1rem;
	line-height:1.42857143;
	border-radius:35px;
	background-color:var(--web-theme-color);
	color:var(--web-theme-color-white);
	border:none;
}
footer button:hover{background-color:var(--web-theme-color-yellow); border:none;} 
/*-------
Application Scenarios
-------*/
#application{ overflow:hidden;}
#application .com-title{ width:28rem;}
#application h2{ padding-top:3rem;}
/*swiper*/
.application-scenarios{ position:relative; margin-top:6rem;}
.application-scenarios .swiper-wrapper{ padding-bottom:4rem;}
.application-scenarios .swiper-slide{ position:relative;}
#application .swiper-pagination-bullet{ width:12px; height:12px;}
#application .swiper-pagination-bullet-active{ background-color:var(--web-theme-color);} 
.application-scenarios-info-txt{ position:absolute; left:0; bottom:0; width:100%; height:30%; padding:2rem;}
.application-scenarios-info-title,.application-scenarios-info-txt ul{ position:relative; z-index:5; color:var(--web-theme-color-white);}
.application-scenarios-info-title{ font-size:2.4rem;}
.application-scenarios-info-txt ul li{ display:inline-block;}
#application .more{background-color:transparent; border-radius:35px; border:rgba(255,255,255,.6) solid 2px;  padding:3px 2rem; margin-top:2rem; margin-left:0; font-size:14px; color:var(--web-theme-color-white) !important;}
#application .more i{ margin-left:2rem;color:var(--web-theme-color-yellow);}
#application .more:hover, #application .more:focus, #application .more:active {
  border-radius:35px;	
  	border:none;
	background-color: var(--web-theme-color);
  color: var(--web-theme-color-white);
}
#application .more:hover i, #application .more:focus i, #application .more:active i {
  color: var(--web-theme-color-white);
}
#application .more:hover:before, #application .more:focus:before,#application .more:active:before {
	border-radius:35px;
	border:none;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
.application-scenarios-img{
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index:1;
  background-color:var(--web-theme-color-yellow);
  overflow: hidden;
  width: 100%;
  height:0;
  transition: .5s ease;
}
.application-scenarios .swiper-slide:hover .overlay {	
  height: 100%;
}
/*------------------------------------------------------------------ny-page---------------------------------------------------*/
/*-------
nybanner
-------*/
#nycombanner{
	position:relative;
	background-size:100% auto;
    background-position:center center;
	background-repeat:no-repeat;
	overflow:hidden;
}
#nycombannertxt{
	position:absolute;
left:0;
top:0;
z-index:1;
color:#fff;
font-display:"swap";
	font-size:4.8rem;
	font-weight:700;
width:100%;
height:70%;
display: -webkit-flex; 
 display: flex;
 justify-content:center;
align-items:center;
}
#ny-about{
	position:relative;
}
#nycombanner img,#ny-about img{width:100%;}
.nycom-content .sy-container{
	position:absolute;
	left:0;
	top:45%;
	right:0;
	bottom:0;
}
.nycommblic-img{ display:none;}
.nycom-content h1{ text-align:center; color:var(--web-theme-color-white);}
/*------------------------------------------------------nypage content--------------------------------------------------------*/
.nycom-title h4{ text-align:center; color:var(--web-theme-color-yellow);}
.nycom-title h2{ line-height:1.8em;}
.nycom-title p{ margin:0 auto; text-align:center;}
/*product details*/
.productsitem{
	padding-bottom:4rem;
	 overflow:hidden;
	  text-decoration:none;
	  background-color:#fff;
	 
}
.productsitem:hover{
	-webkit-box-shadow:0px 0px 20px #aaaaaa;  
    -moz-box-shadow:0px 0px 20px #aaaaaa;  
     box-shadow:0px 0px 20px #aaaaaa;
}
.productsitem .caption{
	color:#333;
	font-size:2.6rem;
	font-weight:600;
	text-align:center;
	position:relative;
	z-index:5;
	border-top:none;
	text-decoration:none;
}
.productsitem .caption span{ display:block;padding-top:1rem;font-size:1.6rem;color:var(--web-theme-color-gray); font-weight:500;}
.productsimg{ overflow:hidden;}
.productsimg img{ width:auto; transition: all .5s ease-in-out; }
.productsitem:hover img{
	transition:1s linear;
	-webkit-transform: scale3d(1.1, 1.1, 1);
              transform: scale3d(1.1, 1.1, 1);
}
.productsitem:hover .caption{
	color:var(--web-theme-color);
}
.productsitem:hover .caption span{
	color:#333;
}

/*page*/
.pagination {
	display:inline-block;
	padding-left:0;
	margin:40px 0;
	border-radius:0
}
.pagination>li {
	display:inline;
}
.pagination>li>a, .pagination>li>span {
	position:relative;
	float:left;
	padding:6px 12px;
	margin-top:-0.7rem;
	margin-left:-1px;
	line-height:1.42857143;
	color:#337ab7;
	text-decoration:none;
	background-color:#fff;
	border:1px solid #ddd
}
/*agent*/
.com-title h2{line-height:1.6em; color:var(--web-theme-color);}
.com-title h4,.com-title p{ text-align:center;}
/*get in touch*/
#get-touch .grid{ grid-template-columns:repeat(2,auto); align-items: center;grid-column-gap:20px; margin-top:6rem; }
.cont-txt{ padding-top:2rem;}
#get-touch .wrap-flex{justify-content: space-between; align-items: center; background-color:#fff; border-radius:15px}
.cont-txt .wrap-flex i{padding:0 4rem;font-size:3rem; color:var(--web-theme-color-black); }
.cont-txt-text{ display: -webkit-flex;  display: flex; justify-content: space-between; align-items: center; margin-top:4rem;background-color:#fff;border-radius:15px}
.cont-txt-text i{ padding:0 4rem; padding-bottom:25vh; font-size:3rem;  color:var(--web-theme-color-black);}
#get-touch .form-control{ background-color:transparent; -webkit-box-shadow:inset 0 1px 1px rgba(234, 91, 36, 0);box-shadow:inset 0 1px 1px rgba(234, 91, 36, 0);-webkit-transition:border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s;border:none; border-radius:35px;}
#get-touch .form-control::-moz-placeholder {width:100%;color:var(--web-theme-color-gray);}
#get-touch .form-control:-ms-input-placeholder {width:100%; color:var(--web-theme-color-gray);}
#get-touch .form-control::-webkit-input-placeholder {width:100%;color:var(--web-theme-color-gray);}
#get-touch .fbtn-txt{padding:3rem 4rem; border-radius:35px;}
.cont-button{display: -webkit-flex;  display: flex; justify-content: center; margin-top:4rem;}
.cont-button  .btn-default{border:var(--web-theme-color-yellow) solid 2px; padding:1.6rem 4rem;  font-size:2rem; color:#333; background-color:transparent;border-radius:35px;}
.cont-button button:hover{background-color:var(--web-theme-color); color:#fff; border:none;} 
.cont-button:hover i{background-color:#333; color:#fff; }
@media screen and (min-width: 768px) and (max-width: 1600px) {	html{font-size:8px;} }
@media screen and (max-width: 1023px) {
	section{padding:4rem 0;}
	h1{font-size:4rem;}	
	h2{ font-size:3.2rem; line-height:1.2em;}
	h3{font-size:2.2rem; line-height:1.2em;}
	h4{font-size:1.4em;} 
	p{font-size:1.1em; font-weight:500;}
/*button*/
.more  {
	width:18rem;
   padding:5px 2rem;
   font-size:14px; 
  margin-left:2rem;
}
#company-info h2{ line-height:1.2em; text-align:center; color:#fff;}
#company-info p{ padding-top:2rem;}
.company-info-content img{ width:5rem;}
#company-info  .company-info-content h2{ line-height:1.8em;}
#company-info  .company-info-content p{ padding-top:0;}
#company-info .grid{grid-template-columns:repeat(2,auto); grid-gap:20px;  padding-top:4rem;} 	
footer .grid{ padding-bottom:4rem; grid-template-columns:auto; grid-row-gap:20px; }
footer  .form-control {display:block; width:100%; height:45px;}
footer  button {margin-left:-12rem;margin-top:5px; display:inline-block;width:10rem;height:35px;padding:4px 1rem;}
.fbtn-txt{padding:14.5px 1.4rem; }
.com-line{ width:5px; height:30px;}
/*nybanner*/
.nycom-content .sy-container{
	position:absolute;
	left:0;
	top:50%;
	right:0;
	bottom:0;
}
/*product series*/
.productsitem .caption{font-size:2.2rem;}
#get-touch .grid{ grid-template-columns:auto; }
.cont-txt-text i{ padding-bottom:20vh; }
}
@media screen and (max-width: 767px) {
html{font-size:8px;}
body{font-size:14px;}
footer  .form-control {display:block;width:100%;height:45px;}
footer  button {margin-left:-12rem;margin-top:5px; display:inline-block;width:10rem;height:35px;padding:4px 1rem;}
/*nybanner*/
#nycombanner{height:68vw;}
.nycombarimg{ display:none;}
.nycommblic-img{ display:block;}
.company-info:nth-child(2) img,.company-info:nth-child(4) img{display:block;  width:20%;} 
.company-info:nth-child(1) img{display:block;  width:22%;} 
.company-info:nth-child(3) img{display:block;  width:26%;} 
#agent .com-title{ padding-bottom:1.6rem; border-bottom:#dcdcdc solid 1px;}
}
@media screen and (max-width: 490px) {
#application .more{ width:10rem; border-radius:35px; padding:3px 2rem; margin-top:2rem; margin-left:0;}
#company-info .grid{grid-template-columns:repeat(2,1fr); justify-content: space-between;}
.cont-button  .btn-default{ width:30rem;font-size:14px;}
footer  button {margin-left:-18rem;width:16rem;}
}