html, body, div, span, applet, object, iframe,blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

body{
    overflow-x: hidden;
    text-rendering: optimizeSpeed;
    background: #FFF;
}

html {
  font-size: 24px;
  font-weight: 100;
  line-height: 1.5;
}

/*====================================================
    2. TYPOGRAPHY. 
  ====================================================*/
h1, h2, h3, h4, h5, h6, p, ul,ol{
    margin-top: 0;
    margin-bottom: 1rem;
    color: #323B3C;
}

h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0.5rem;
    line-height: 1.1;
    font-family: 微软雅黑;
}

h1, .h1 {
    font-size: 1.602rem;
    font-weight: 600;
}

h2, .h2 {
    font-size: 1.424rem;
    font-weight: 600;
    color: #35414b;
}

h3, .h3 {
    font-size: 0.90rem;
    color: #35414b;
    font-weight: 600;
}

h4, .h4 {
    font-size: 0.85rem;
    color: #35414b;
    margin-bottom: 5px;
}

h5, .h5 {
    font-size: 0.70rem;
    color: #3AB3DF;
    font-weight: 500;
    text-transform: uppercase;
}

h6, .h6 {
    font-size: 0.889rem;
    text-transform: uppercase;
    font-weight: 500;
    color: #262626;
}

p {
  font-size: 15px;
  font-family: 微软雅黑;
  color: #8C8C9E;
  font-weight: 400;
  line-height: 2;
   margin-bottom: 0px;
}

a {
	color: #FFF;
    text-decoration: none;
    transition: 0.3s;
}

a:hover {
	color: #3AB3DF;
    text-decoration: none;
}

/*====================================================
    3. SPACE AND ALIGMENT. 
  ====================================================*/
.container, .container-fluid{
    margin: 3rem auto 3rem auto;
}


.inner-color{
    padding: 1px 0px;
    background-color: #F7FAFA;   
}

/*====================================================
    4. PRELOADER 
  ====================================================*/
#loader-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1031;
  background-color: #F2F2F2;
}

.loader2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.loader {
  max-width: 150px;
  width: 100%;
  height: auto;
  stroke-linecap: round;
}

circle {
  fill: none;
  stroke-width: 3.5;
  -webkit-animation-name: preloader;
          animation-name: preloader;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-transform-origin: 170px 170px;
          transform-origin: 170px 170px;
  will-change: transform;
}

circle:nth-of-type(1) {
  stroke-dasharray: 550px;
}

circle:nth-of-type(2) {
  stroke-dasharray: 500px;
}

circle:nth-of-type(3) {
  stroke-dasharray: 450px;
}

circle:nth-of-type(4) {
  stroke-dasharray: 300px;
}

circle:nth-of-type(1) {
  -webkit-animation-delay: -0.15s;
          animation-delay: -0.15s;
}

circle:nth-of-type(2) {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s;
}

circle:nth-of-type(3) {
  -webkit-animation-delay: -0.45s;
          animation-delay: -0.45s;
}

circle:nth-of-type(4) {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s;
}

@-webkit-keyframes preloader {
  50% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes preloader {
  50% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

/*====================================================
    5. BUTTONS.
  ====================================================*/
.btn {
  display: inline-block;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 0.375rem 0.75rem;
  font-size: 0.90rem;
  line-height: 1.5;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  font-family: 微软雅黑;
  font-weight: 500;
  border: none;
  border-radius: 5px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
    
.btn-custom {
  color: #FFF;
  transition: 0.9s;
  padding: 0.25rem 1rem;
  font-size: 0.60rem;      
  background: #eb662d;
  border: solid 2px #eb662d;
}

.btn-custom:hover {
  color: #FFF;
  background: #3AB3DF; 
  border: solid 2px #3AB3DF;
}

.btn-custom:focus, .btn-custom.focus {
  box-shadow: none;
}

.btn-custom.disabled, .btn-custom:disabled {
  color: #fff;
  background-color: #3AB3DF;
  border-color: #3AB3DF;
}

.btn-custom:not(:disabled):not(.disabled):active, .btn-custom:not(:disabled):not(.disabled).active,
.show > .btn-custom.dropdown-toggle {
  color: #fff;
  background-color: none;
  border-color: none;
}

.btn-custom:not(:disabled):not(.disabled):active:focus, .btn-custom:not(:disabled):not(.disabled).active:focus,
.show > .btn-custom.dropdown-toggle:focus {
  box-shadow: none;
}

a.btn-slider {
  display: inline-block;
  text-decoration: none;
  color: #FFF;
  font-weight: bold;
  font-size: 14px;
  position: relative;
  padding: 0.5rem 2rem;
  overflow: hidden;
  transition: 0.3s ease;
  margin-bottom: 0px;
  font-family: 微软雅黑;
  background-color: #eb662d;
}

a.btn-slider:before {
  content: '';
  display: block;
  height: 100%;
  width: 100%;
  border-bottom: 2px solid #eb662d;
  border-left: 2px solid #eb662d;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.3s ease;
}

a.btn-slider:after {
  content: '';
  display: block;
  height: 100%;
  width: 100%;
  border-top: 2px solid #eb662d;
  border-right: 2px solid #eb662d;
  position: absolute;
  right: 0;
  top: 0;
  transition: 0.3s ease;
}
    
a.btn-slider:hover:before,
a.btn-slider:hover:after {
  width: 1rem;
  height: 1rem;
  border-color: #FFF;
}


a.btn-slider:focus, .a.btn-slide.focus {
  box-shadow: none;
}

a.btn-slider.disabled, .a.btn-slide:disabled {
  color: #fff;
  background-color: #3AB3DF;
  border-color: #3AB3DF;
}


.btn-booking {
    color: #FFF;
    transition: 0.9s;
    padding: 0.375rem 0.70rem;
    font-size: 0.60rem;      
    background: #eb662d;
    border: solid 2px #eb662d;
    font-size: 13px;
    border-radius: 20px;
    text-transform: none;
}

.btn-booking:hover {
  color: #FFF;
  background: #e95516; 
  border: solid 2px #e95516;
}

.btn-booking:focus, .btn-reply.focus {
  box-shadow: none;
}

.btn-booking.disabled, .btn-booking:disabled {
  color: #fff;
  background-color: #EF8354;
  border-color: #EF8354;
}

.btn-booking:not(:disabled):not(.disabled):active, .btn-booking:not(:disabled):not(.disabled).active,
.show > .btn-booking.dropdown-toggle {
  color: #fff;
  background-color: none;
  border-color: none;
}

.btn-booking:not(:disabled):not(.disabled):active:focus, .btn-booking:not(:disabled):not(.disabled).active:focus,
.show > .btn-booking.dropdown-toggle:focus {
  box-shadow: none;
}
    
/*====================================================
    6. HEADER.
  ====================================================*/
.top-header{
    background-color: #556877;
    height: 50px;
    width: 100%;
    clear: both;
    position: fixed;
    top: 0;
    z-index: 99;
}

.top-header .container{
    padding: 0px;
}

.top-header p{
    margin-bottom: 0px;  
    color: #fff; 
    font-size: 14px;
}

.header-left{
    float: left;
    margin-bottom: 5px;
    background-color: #3AB3DF;
    width: 680px;
    margin-left: -450px;
    text-align: right;
    padding: 10px 20px 12px 0px;
}
    
.header-left p::before{
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    content: "\f095";
    margin-right: 10px;
}
    
.header-left strong{
    font-weight: 600;
}

.header-right{
    float: right;
    padding: 5px 0px;
}

.ht-right-email{
    display: inline-block;
    margin-right: 10px;
    border-right: 1px solid rgba(255, 255, 255, 0.5);
    padding-right: 15px;
}
  
.ht-right-email p::before{
    font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0e0";
    margin-right: 10px;
}
    
.ht-right-social{
    display: inline-block;
    margin-right: 10px;
    color: #FFF;
    font-size: 15px;
} 
    
header{
    position: relative;
    height: 100%;
    z-index: 100;
}

header .container{
    margin: auto;
}

/*====================================================
    7. FOOTER.
  ====================================================*/
footer{
    background-color: #1e2128;
    padding:2rem 0rem;
} 

footer .container{
    margin: 1rem auto;
}
footer .container .row a{ color:#fff;}
footer .container .row a:hover{ color:#fff;}

.flink_box{ display:block; width:100%; text-align:center; color:rgba(255,255,255,0.5);font-size:12px;}
.flink_box a{ display:inline-block; width:auto; margin:0px 15px; color:rgba(255,255,255,0.5); font-size:12px;}
.flink_box a:hover{color:rgba(255,255,255,0.7); text-decoration:underline;}

.footer-col .footer-logo{
    width: 180px;
}

.footer-col .footer-logo img{
    width: 100%;
}

.footer-col h4{
    color: #FFF;
    font-size: 17px;
}

.footer-col h4:after {
	background: #3AB3DF; 
	content: '';
	display: block;
	height: 3px;
	margin: 15px 0px 20px;
	width: 60px;
}

.footer-col p{
    line-height: 1.5;
    margin-top: 15px;
    font-weight: 13px;
    color: #FFF;
}

.fi-fas{
    float: left;
    margin-right: 15px;
    color: #3AB3DF;
    line-height: 0.5;
    margin-bottom: 10px;
}

.fi-fas .fas{
    font-size: 14px;
}

.span-fi{
    clear: both;
    margin: 20px 0px;
}

.span-fi p{
    font-size: 13px;
}

.media-post{
    clear: both;
    height: 70px;
}

.media-thumb{
    width: 70px;
    float: left;
    margin-right: 15px;
}

.media-thumb img{
    width: 100%;
}

.media-caption h5{
    color: #FFF;
    font-size: 14px;
    line-height: 1.3;
}

.media-caption p{
    margin-top: -5px;
    font-size: 13px;
}

footer hr.divider{
    margin: 30px auto 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-col hr.divider{
    margin: 20px auto;
    border-top: 1px solid rgba(255, 255, 255, 0.2); 
}

.popular-links ul li{
    font-family: 微软雅黑; 
    color: #FFF;
    font-size: 14px;
    font-weight: 400;
    line-height: 2.5;
    list-style-type:none;
}

.popular-links ul li:before{
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    content: "\f101";
    margin-right: 10px;
}

.footer-grid-box{
    padding: 10px;
}

.gb-photos{
    padding: 3px;
}

.gb-photos img{
    width: 100%;
}

.footer-bottom{
    padding: 10px 0px;
}

.fb-copyright{
    float: left;width:100%; text-align:center;
}

.fb-copyright p{
    color: #FFF;
    font-size: 14px;
}

.fb-social{
    float: right;
    color: #FFF;
    font-size: 15px;
}

.span-fb-social{
    display: inline-block;
    margin-right: 20px;
}

.last-box{
    margin-right: 0px;
}

/*====================================================
    29. MODAL POPUP.
  ====================================================*/
.modal-box{
    text-align: center;
}

.modal-box p{
    margin: 15px 0px 15px 0px;
}

.modal-sm .modal-content{
    background: #FFF;
    border: 1px solid #ddd;
   border: 1px solid rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
          box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    padding: 10px 20px 10px 20px;
}

.close{
    color: #000;
}

@media (min-width: 992px) {
  .modal-md {
    width: 600px;
  }
}

@-webkit-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@-moz-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@-ms-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}

    
.popup-youtube .video-image:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
    background: none;
} 
    
.youtube-popup{
    position: relative;
}
    
.video-image img{
    width: 100%
}

/*====================================================
    31. SCROLLING TOP.
  ====================================================*/
@media only screen and (min-width: 1024px) {
  main p {
    font-size: 20px;
    font-size: 1.25rem;
  }
}

.cd-top {
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 40px;
  right: 10px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: rgba(58, 179, 223) url(../images/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden;  
  border-radius: 50%;  
  z-index: 4;
}

.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}

.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}

.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}

.no-touch .cd-top:hover {
  background-color: #3AB3DF;

}

@media only screen and (min-width: 768px) {
  .cd-top {
    right: 20px;
    bottom: 20px;
  } 
}

@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 60px;
    width: 60px;
    right: 30px;
    bottom: 30px;
  }
}

/*====================================================
    32. SLIDER.
  ====================================================*/

.display-4{
    color: #FFF;
    font-size: 2.5rem;
    line-height: 1.2;
}

.lead{
    color: #FFF;
    font-size: 18px;
    font-weight: 300;
    width: 70%; 
}

.animated {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

/*大图轮播*/
#model_banner {
  width: 100%;
  position: relative;
  overflow: hidden;
}
#model_banner .banner_img img {
  width: 100%;
  max-width: none;
  max-height: none;
}
.slick-dotted.slick-slider {
  margin-bottom: 0;
}
#model_banner .slick-dots {
  bottom: 16px;
}
#model_banner .slick-dots li {
  width: 10px;
  height: 10px;
  margin: 0 4px;
}
#model_banner .slick-dots li button {
  width: 10px;
  height: 10px;
  background: #e0dbda;
  padding: 0;
  transition: 400ms;
  border-radius: 50%;
}
#model_banner .slick-dots li.slick-active button {
  background: #005baa;
  transition: 400ms;
}
.slick-dots li button:before {
  display: none;
}
.btn-more{
    margin-top: 1.5rem;
}

/*====================================================
    33. HOME PAGE ONE.
  ====================================================*/

.front-layers{
    background-color: #FFF;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
    margin-top: -180px;
    z-index: 3;
    position: relative; height:385px;
}
    
.front-layers .row{
    margin: 0px;
}
  
  
  .js-silder{
	position: relative;	
	min-width: 320px;
}
.silder-scroll{
	width: 100%;
	overflow: hidden;
}
.silder-main{
	position: relative;
	width: 100%;
	overflow: hidden;
}
.silder-main-img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
.silder-main-img img{
	width: 100%;
}
.js-silder-ctrl{
	width: 100%;
	text-align: center;
}
.silder-ctrl-prev,
.silder-ctrl-next{
	position: absolute;
	top: 0;
	width: 8%;
	height: 100%;
	vertical-align: middle;
	cursor: pointer;
	color: #fff;
	font-family: "宋体";
	font-size: 52px;
	font-weight: 600;
	text-shadow: #666 2px 2px 5px;
}
.silder-ctrl-prev{
	left: 0;
	text-align: left;
}
.silder-ctrl-next{
	right: 0;
	text-align: right;
}
.silder-ctrl-prev>span,
.silder-ctrl-next>span{
	position: absolute;
	top: 50%;
	margin-top: -40px;
}
.silder-ctrl-prev>span{
	left: 0;
}
.silder-ctrl-next>span{
	right: 0;
}
.silder-ctrl-con{
	display: inline-block;
	width: 4%;
	padding: 10px 0;
	margin: 0 10px;
	cursor: pointer;
}
.silder-ctrl-con>span{
	display: block;
	line-height: 0;
	text-indent: -9999px;
	overflow: hidden;
	padding: 5px 0;
	cursor: pointer;
	background-color: #e4e4e4;
}
.silder-ctrl-con.active>span{
	background-color: #7bbedf;
}

@media (max-width: 768px){
	.silder-ctrl-prev,
	.silder-ctrl-next{
		width: 10%;
		font-size: 26px;
		margin-top: -25px;
	}
	.silder-ctrl-con{
		width: 14px;
		height: 14px;
		padding: 0;
		margin: 0 5px;
	}
	.silder-ctrl-con>span{
		display: block;
		width: 100%;
		height: 100%;
		border-radius: 50%;
		padding: 0;
	}
}
    
/*index_about*/
.about_left_img{ display:inline-block; width:400px; height:320px; overflow:hidden; border-radius:10px; margin-left:30px; margin-top:30px;}
.about_left_img img{ display:block; width:100%; height:320px;object-fit:cover;}

.about_right{ display:inline-block; width:36%; margin-top:90px; margin-left:3%; font-size:14px; letter-spacing:1px; margin-top:60px; height:200px; overflow:hidden; color:#999; line-height:1.5em; margin-right:3%; vertical-align:top;}
.about_right p{ display:block; width:100%; font-size:16px; color:#999; margin-bottom:25px;}
.about_right p font{ color:#999; font-size:24px; display:block;}

.index_right_img{display:inline-block; width:180px; height:200px; border-radius:10px; margin-top:150px;object-fit:cover;}

:root .about_left_img{ display:inline-block;}
/*index_pro*/
.index_pro{ display:block; width:100%;}
.index_pro h2{ display:block; width:100%; color:#333; font-size:24px; text-align:center; margin-bottom:15px;}
.index_pro .jj{ display:block; width:100%; font-size:14px; line-height:1.5em; color:#555; text-align:center}

/*index_pro_list*/


.index_pro_list{ display:block; width:100%; margin-top:50px; height:auto;}
.index_pro_list ul{ display:block; width:102%;}
.index_pro_list ul li{ display:inline-block; width:23.8%; border:1px #eee solid; padding:0.5%; margin-right:0.5%;}
.index_pro_list ul li a img{ display:block; width:100%; height:300px;object-fit:cover;}
.index_pro_list ul li a p{ display:block; width:100%; text-align:center;}
.index_pro_list ul li:hover{ background:#83985d;}
.index_pro_list ul li:hover p{ color:#fff;}


.index_Pro_list .pro_left{ display:inline-block; width:48%; height:auto; vertical-align:top;}
.index_Pro_list .pro_left img{ display:block; width:100%; height:355px; border-radius:10px; overflow:hidden;object-fit:cover;}

.index_Pro_list .pro_right{ display:inline-block; margin-left:10%; width:41%; height:auto; vertical-align:top;color:#999;}
.index_Pro_list .pro_right p{ font-size:24px; color:#999; margin-top:20px; display:block; width:100%; font-weight:bold;}
.index_Pro_list .pro_right p font{font-size:14px; color:#999; display:block; font-weight:normal;}

.index_Pro_list .pro_right img{ display:block; width:81%; height:220px; border-radius:10px; overflow:hidden;object-fit:cover; margin-top:30px;}

.wenzi{ position:absolute; right:0PX; top:0px; width:460px; text-align:center;}
.wenzi p{font-size:24px; color:#999; margin-top:20px; display:block; width:100%; font-weight:bold;}
.wenzi p font{font-size:14px; color:#999; display:block; font-weight:normal;}


.index_Pro_list1{ display:block; width:100%; margin-top:50px; height:auto; color:#999; font-size:24px; position:relative; padding-bottom:100px;}

.index_Pro_list1 .pro_left p{ font-size:24px; color:#999; text-align:center; display:block; width:100%; font-weight:bold;}
.index_Pro_list1 .pro_left p font{ font-size:18px; color:#999; text-align:center; display:block; font-weight:normal;}

.index_Pro_list1 .pro_left{ display:inline-block; width:49.5%; height:auto;}
.index_Pro_list1 .pro_left div{top:90px; z-index:-1; display:block; width:100%; height:auto;}


.index_Pro_list1 .pro_left div a { display:block; width:100%; height:530px; overflow:hidden;}
.index_Pro_list1 .pro_left div a:last-child{ display:block; width:100%; height:350px;overflow:hidden;cursor:pointer;}


.index_Pro_list1 .pro_left div a img{ display:block; width:100%; height:530px;overflow:hidden;object-fit:cover;cursor:pointer;}
.index_Pro_list1 .pro_left div a:last-child  img:{ display:block; width:100%; height:350px;overflow:hidden;object-fit:cover;cursor:pointer;}


.index_Pro_list1 .pro_right{ display:inline-block; margin-left:4%; width:44%; height:auto; vertical-align:top;}
.index_Pro_list1 .pro_right div{ font-size:24px; margin-top:70px;}
.index_Pro_list1 .pro_right div hr{ margin-top:40px;}

.index_Pro_list1 .pro_right img{ display:block; width:100%; height:700px; border-radius:10px; overflow:hidden;object-fit:cover; margin-top:30px;}

.index_pro_list2{ display:block; width:100%; height:auto; margin-top:90px;}
.index_pro_list2 .pro_left{ display:inline-block; width:50%; vertical-align:top;height:400px;overflow:hidden;}
.index_pro_list2 .pro_left img{ display:block; width:100%; height:400px; object-fit:cover;}


.index_pro_list2 .pro_right{ display:inline-block; width:50%; height:260px; background:#f5f5f5; padding:30px 0px; margin-left:-40px; margin-top:60px;}
.index_pro_list2 .pro_right h3{ color:#999; font-size:24px;width:80%; margin:0 auto; margin-top:20px;}
.index_pro_list2 .pro_right p{ color:#999; font-size:14px; display:block; width:80%; margin:0 auto; margin-top:20px; margin-bottom:20px;}
.index_pro_list2 .pro_right span{ color:#999; font-size:14px;width:80%; margin:0 auto; display:block;}
.index_pro_list2 .pro_right a:hover{ color:#333;}

/*footer*/
.foot_list{ display:block; width:100%; text-align:center; color:#fff;}
.foot_list p{ color:#fff;}
.foot_list img{ margin-bottom:20px;}

/*page_banner*/
.banner{ width:100%; height:350px; overflow:hidden; position:relative;font-size:0;}
.b-img{ height:350px;  position:absolute; left:0; top:0;}
.b-img a{ display:block; height:350px; float:left;}
.b-list{ height:50px; padding-top:330px; position:relative; margin:0 auto;z-index:1;}
.b-list span{ display:block;cursor:pointer; width:10px; height:10px; border-radius:50%; border:3px solid #fff; float:left; margin:0 5px; _margin:0 3px;}
.b-list .spcss{border:3px solid #14ab04;}
.bar-left{ position:absolute; z-index:1; display:block; width:100px; height:100%; left:0px; background:none; top:0px; }
.bar-right{ position:absolute;z-index:1; display:block; width:100px; height:100%; right:0px; background:none; top:0px; }
.bar-left em{ display:block; width:30px; height:78px; background:url(../images/arrow.png) 15px 0px no-repeat; margin:0 auto; margin-top:120px;}
.bar-right em{ display:block; width:30px; height:78px; background:url(../images/arrow.png) -85px 0px no-repeat; margin:0 auto; margin-top:120px;}
.bar-left .emcss{ background-position:15px -100px;}
.bar-right .emcss{ background-position:-85px -100px;}

.page_btn{ display:block; margin-top:40px; font-size:14px; color:#666;}
.page_btn a{ display:inline-block; width:49%; font-size:14px; color:#666; height:auto; line-height:20px; text-align:center;}
.page_btn a:hover{ color:#26a027;}
.page_btn a span{ display:inline-block; margin-right:20px;}

/*page_pro*/
.pro_list{ display:block; widows:100%; height:auto; margin-top:50px;}
.pro_list ul{ display:block; width:102%;}
.pro_list ul li{ display:inline-block; vertical-align:top; margin-bottom:20px; width:31.5%; margin-right:1.3%; height:400px; border:1px #ccc solid;}
.pro_list ul li span{ display:block; width:100%; height:360px; overflow:hidden;}
.pro_list ul li img{ display:block; width:100%; height:360px;object-fit:cover;transition: all 0.6s;}
.pro_list ul li p{ display:block; width:100%; height:40px; line-height:40px; text-align:center; font-size:14px;}
.pro_list ul li a{ display:block; width:100%; height:400px;}

.pro_list ul li:hover img {
	transform: scale(1.2);
}

.pc_about{ display:block; width:100%; min-height:1280px;  height:auto; background:url(../images/about_bj.jpg) no-repeat center center #fdfcf7; background-size:cover;}
.two_menu{ display:block; width:100%; text-align:center;margin:20px auto;}
.two_menu a{ display:inline-block; color:#999; border:1px #ccc solid; width:auto; height:auto; padding:5px 10px; margin-right:10px; font-size:14px;}

/*news*/
.news_list{ display:block; width:103%; height:auto; margin-bottom:50px; margin-top:50px; text-align:left;}

.news_list li{ display:inline-block; border-bottom:1px #ddd dotted; padding-bottom:15px; width:100%;  margin-bottom:20px; height:130px;float:left;}
:root .news_list li{ display:inline-block; border-bottom:1px #ddd dotted; padding-bottom:15px; width:100%; vertical-align:top; margin-bottom:20px; height:180px;float:none;}

.news_list li .news_R{ display:block;width:100%;vertical-align:top;overflow:hidden;float:left;}

.news_list li .news_R h5{ display:block; width:100%; font-size:16px; font-weight:normal; height:35px; line-height:35px; overflow:hidden;}
.news_list li .news_R span{ color:#bbb; font-size:12px; display:block; width:100%; height:25px; line-height:25px;}
.news_list li .news_R .news_con{ display:block; width:100%; color:#999; font-size:12px; line-height:21px; height:50px; overflow:hidden;}
.news_list li a{ color:#333;}
.news_list li a:hover{ color:#060}


/*fanye*/
.pages{
      height: 60px;
    padding: 20px 0 30px;
    width: 100%;
    clear: both;
}
.tcdPageCode {
    text-align: center;
    color: #808080;
    font-size: 14px;
}
.tcdPageCode li{
  display: inline;
}
.tcdPageCode span.disabled {
    display: inline-block;
    height: 35px;
    line-height: 35px;
    padding: 0 14px;
    margin: 0 2px;
    color: #808080;
    background: #fff;
    border: 1px solid #e6e3e3;
    vertical-align: middle;
    border-radius:1px;
}
.tcdPageCode span.current {
    display: inline-block;
    height: 35px;
    line-height: 35px;
    padding: 0 14px;
    margin: 0 2px;
    color: #fff;
    background-color: #1baadb;
    border: 1px solid #1baadb;
    vertical-align: middle;
    border-radius:1px;
}
.tcdPageCode a {
    display: inline-block;
    color: #808080;
    height: 35px;
    line-height: 35px;
    background: #fff;
    padding: 0 14px;
    border: 1px solid #ddd;
    margin: 0 2px;
    vertical-align: middle;
    border-radius:1px;
}

/*show*/
.pnews_tite{ display:block; width:100%; height:auto; line-height:35px; font-size:24px; text-align:center; font-weight:normal;}
.pnews_tite p{ display:block; width:100%; font-size:14px; color:#666;}
.xx_con1{ width:100%; display:block; min-height:400px; font-size:14px; color:#333; line-height:2em;}
.xx_con1 img{max-width:100%;height:auto;}
.nav-logo1{ display:none}

.lxwm_left{ display:inline-block;width:48%;margin-top:30px; vertical-align:top;}
.lxwm_right{display:inline-block;width:48%;margin-top:30px;}

@media screen and (max-width:1920px){
    .news_list li .news_R h5{ margin-top:0px;}
	}
	
@media screen and (max-width:1600px){
	
	}	
@media screen and (max-width:1360px){

	.news_list li{ width:100%;}	}
	.page_tite,.news_about,.pro_about,.wap_about{ display:none;}
@media screen and (max-width:600px){
	.navigation-portrait .nav-logo > img{ height:40px;}
	.front-layers,.index_Pro_list,.index_Pro_list1{ display:none}
	.news_list{ display:block; width:100%; height:auto; margin-bottom:50px; margin-top:10px;}
.news_list li{ display:block; border-bottom:1px #ddd dotted; padding-bottom:10px; width:100%; height:auto; margin-bottom:20px;}
:root .news_list li{ display:inline-block; border-bottom:1px #ddd dotted; padding-bottom:15px; width:100%; vertical-align:top; margin-bottom:20px; height:130px;float:none;}

.news_list li .news_R{ display:block; width:100%;vertical-align:top;}
.news_list li .news_R h5{ display:block; width:100%; font-size:16px; margin-top:0px; font-weight:normal; height:30px; line-height:30px;}
.news_list li .news_R span{ color:#bbb; font-size:12px;}
.news_list li .news_R .news_con{ display:block; width:100%; color:#999; font-size:12px; height:60px;}
.news_list li a{ color:#333;}

.index_pro h2{ font-size:1.1rem; font-weight:400;}

.pro_about{ display:block; width:100%;}
.pro_list{ display:block; widows:100%; height:auto; margin-top:20px;}

.pro_list ul li{ display:inline-block; vertical-align:top; margin-bottom:20px; width:47%; margin-right:1.3%; height:210px; border:1px #ccc solid;}
.pro_list ul li span{ display:block; width:100%; height:170px; overflow:hidden;}
.pro_list ul li img{ display:block; width:100%; height:170px;object-fit:cover;transition: all 0.6s;}
.pro_list ul li p{ display:block; width:100%; height:40px; line-height:40px; text-align:center; font-size:14px;}
.pro_list ul li a{ display:block; width:100%; height:210px;}

.banner{ width:100%; height:200px; overflow:hidden; position:relative;font-size:0}
.b-img{ height:200px;  position:absolute; left:0; top:0;}
.b-img a{ display:block; height:200px; float:left;}
.b-list{ height:50px; padding-top:170px; position:relative; margin:0 auto;z-index:1;}
.b-list span{ display:block;cursor:pointer; width:10px; height:10px; border-radius:50%; border:1px solid #fff; float:left; margin:0 5px; _margin:0 3px;}
.b-list .spcss{border:3px solid #14ab04;}
.bar-left{ position:absolute; z-index:1; display:block; width:20px; height:70px; left:0px; background:none; top:0px; }
.bar-right{ position:absolute;z-index:1; display:block; width:20px; height:70px; right:0px; background:none; top:0px; }
.bar-left em{ display:block; width:100%; height:100%; background:url(../images/arrow.png) 10px 0px no-repeat; margin:0 auto; margin-top:50px;}
.bar-right em{ display:block; width:100%; height:100%; background:url(../images/arrow.png) -90px 0px no-repeat;margin:0 auto; margin-top:50px;}
.bar-left .emcss{ background-position:10px -100px;}
.bar-right .emcss{ background-position:-90px -100px;}
.xx_con1{ display:block; margin:0 auto; width:90%;}
.xx_con1 img{ max-width:100%;}
.page_tite{ display:block; width:100%; text-align:center;}
.page_btn a{ display:block; width:100%; margin-bottom:20px;text-align:left;}
.wap_about,.pro_about,.news_about{ display:block;}
.news_about{ width:98%; margin:0 auto;}
.wap_about{ font-size:14px; line-height:1.5em; width:96%; margin:0 auto; display:block; color:#999;}
.container{ margin:1rem auto;}

.index_pro_list{ display:block; width:100%; margin-top:50px; height:auto;}
.index_pro_list ul{ display:block; width:102%;}
.index_pro_list ul li{ display:inline-block; width:48%; border:1px #eee solid; padding:0.5%; margin-right:0.5%; margin-bottom:20px;}
.index_pro_list ul li a img{ display:block; width:100%; height:200px;object-fit:cover;}
.index_pro_list ul li a p{ display:block; width:100%; text-align:center;}
.index_pro_list ul li:hover{ background:#83985d;}
.index_pro_list ul li:hover p{ color:#fff;}

.index_pro_list2 .pro_left{ display:block; width:100%; height:200px;}
.index_pro_list2 .pro_left img{ height:200px;}
.index_pro_list2 .pro_right{ display:block; width:100%; margin:0px;}
.flink_box{ text-align:left}
.flink_box span{ display:block; width:auto; margin-left:15px;}
.flink_box font{ display:block; width:100%; text-align:left;}

.lxwm_left{ display:block;width:100%;margin-top:30px;}
.lxwm_right{display:block;width:100%;margin-top:30px;}
.nav-logo1{ display:block; width:130px; margin-top:20px; margin-left:20px;}
.nav-logo1 img{ width:100%;}
	}