/**
 
 @Name: layuiNetCompany - 大气风格的网络公司企业模版
 @Author: xuxingyu
 @Copyright: layui.com
 
 */ 

body{background: #fff;}

/** 首页 */

/*导航部分*/
.nav{width: 100%; height: 80px; background: #FFF; overflow: hidden; }  
.nav .layui-container{position: relative; transition: all 400ms ease-out;}
.nav .nav-logo{height: 100%; position: absolute; top: 0; left: 15px; line-height: 80px;}
.nav .nav-logo img{max-height: 100%; margin-top: 5px;}
.nav .nav-logo span{font-size:18px}
.nav .nav-list{display: inline-block; height: 40px;}
.nav .nav-list button{width: 25px; height: 30px; position: absolute; top: 30px; right: 15px; background-color: transparent; border: none; outline: none; cursor: pointer;}
.nav .nav-list button span{display: block; width: 25px; height: 2px; background: #333; margin-bottom: 6px; transition: 0.5s;}
.nav .nav-list button span.spa1{transform: rotate(45deg);}
.nav .nav-list button span.spa3{transform: rotate(-45deg) translate(5px,-5px);}
.nav .layui-nav{width: 100%; position: absolute; top: 40px; right: 0; color: #000; background: transparent;}
.nav .layui-nav .layui-nav-item{display: block; line-height: 60px;}
.nav .layui-nav *{font-size: 18px;}
.nav .layui-nav .layui-nav-item a{padding: 0 0; color: #000;}
.nav .layui-nav-bar,
.nav .layui-nav .layui-this:after{height: 2px; background-color: #333;}
.nav .layui-nav .layui-this a
,.nav .layui-nav .layui-nav-item a:hover{color: #333;}

.search{display:block; position:absolute; top: 2px; right: 35px; overflow: hidden;display: flex;flex-direction: row; justify-content: center; width: 320px;margin-top: 5px;}
.search input{display: block;height: 28px;line-height: 28px;border: 1px solid #333; color: rgba(0,0,0,.85);width: 80%;text-indent: 10px;}
.search button{height: 30px; line-height: 30px; border:none; padding: 0 18px; background-color: #333; color: #fff;white-space: nowrap;text-align: center;font-size: 14px; cursor: pointer;}
 

.fbanner{min-width: 100%; height: 600px; position: relative;overflow: hidden;}
.fbanner img{ position: absolute; top: 0; left: 0; height: 100%; z-index: 10;}
.fbanner .panel{padding-left: 20px; margin-top: 150px; position: relative; z-index: 20;}
.fbanner .panel .title{ font-size: 42px; color: #FFF;}
.fbanner .panel .p{ margin-top: 30px; padding-left: 80px; font-size: 26px; color: #FFF;}

.cases{overflow: hidden;margin-top: 20px;}
.cases .item{text-align: center;}
.cases .item .t{font-size: 18px; line-height: 40px;}
.cases .item p{overflow: hidden;margin-bottom: 20px;}
.cases .item p img{max-width: 100%;}

.ad{min-width: 100%; height: 350px; position: relative;overflow: hidden; background: #fcd303; text-align: center;}
.ad img{ height: 90%;margin-top: 1%;}


.ad1{min-width: 100%; height: auto; position: relative;overflow: hidden; text-align: center; margin: 20px 0;}
.ad1 img{max-width: 100%;}

.ad1.left{text-align: left;}

.about-us{overflow: hidden; margin: 20px 0; width: 100%;}
.about-us .title{ font-size: 48px; }
.about-us .title span{font-size: 70px;font-weight: bold;}
.about-us .p{margin-top: 20px; overflow: hidden;font-size: 18px;line-height: 40px;}
.about-us .p .layui-collapse{ border: none; border-bottom: 1px solid #eee;}
.about-us .p .layui-colla-title{  line-height: 80px;font-size: 18px; height: auto;background: none;}
.about-us .p .layui-colla-content{ line-height: 40px;font-size: 18px; text-indent: 22px;}


.ad-crt{min-width: 100%; position: relative;overflow: hidden; background: #fff; text-align: center;}
.ad-crt img{max-width: 100%;}

/*底部*/
.footer{margin-top: 60px; padding-bottom: 70px; background: #212121;}

.footer .contact-us{overflow: hidden; margin: 20px 0; width: 100%;}
.footer .contact-us .title{ font-size: 48px; color: #fff;}
.footer .contact-us .title span{font-size: 70px;font-weight: bold;color: #fff;}
.footer .contact-us .p{ padding-left: 60px; margin-top: 10px; line-height: 28px;font-size: 18px;color: #fff;}

.footer .footer-contact{color: #fff; padding-left: 60px;} 
.footer .footer-contact .contact-top{padding-top: 20px; line-height: 30px; font-size: 16px;}
.footer .footer-contact .contact-bottom{line-height: 35px;font-size: 16px;color: #fff;}
.footer .footer-contact .contact-bottom:hover{color: #fff;}

 
/* 内页 */

/* 标题 */
.detail{min-width: 100%; position: relative;overflow: hidden; background: #fcd303; padding: 20px 0;} 
.detail .title{ font-size: 48px;}
.detail .title span{font-size: 70px;font-weight: bold;}
.detail .p{ padding-left: 60px; margin-top: 10px; line-height: 28px;font-size: 18px;}

/* 内容 */
.detail-crt{min-width: 100%; position: relative;overflow: hidden; margin: 50px 0;}
.detail-crt .list{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;}
.detail-crt .list .item{ width: 48%; margin-left: 2%; margin-bottom: 20px;}
.detail-crt .list .item img{ width: 100%;}

.detail-crt .p{margin-top: 10px; line-height: 40px;font-size: 18px; padding-bottom: 30px;}


/*WhatsApp*/
.whatsapp {
  position: fixed;
  bottom: 60px;
  right: 15px;
  width: 50px;
  height: 50px;
  background-color: #4dc247;
  border-radius: 50%;
  text-align: center;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
}

.whatsapp:hover {
  box-shadow: 2px 2px 11px rgba(0, 0, 0, 0.7);
}

.whatsapplink svg {
  width: 40px;
  height: 50px;
  fill: #fff;
}

@media screen and (max-width: 480px){  

  .nav .nav-logo span{display: none;}
  .search{ top: 22px; right: 80px;width: 220px;}

  .fbanner{  height: 200px; } 
  .fbanner img{ position: absolute; top: 0; left: 0; height: 200px; z-index: 10;}
  .fbanner .panel{padding-left: 20px; margin-top: 52px; position: relative; z-index: 20;}
  .fbanner .panel .title{ font-size: 22px; color: #FFF;}
  .fbanner .panel .p{ margin-top: 5px; padding-left: 0; font-size: 14px; color: #FFF;}

  .ad{ height: 150px;padding: 10px 0;}
  .ad img{ height: 95%;margin-top: 1%;}
 
  .about-us .title{ font-size: 32px; }
  .about-us .title span{font-size: 50px;}
  .about-us .p{line-height: 20px;font-size: 14px;}

 
  .footer .contact-us .title{font-size: 32px;}
  .footer .contact-us .title span{font-size: 50px;}
  .footer .contact-us .p{ padding-left: 40px; line-height: 20px;font-size: 14px;}
  .footer .footer-contact{padding-left: 40px;} 

 
  .detail .title{ font-size: 32px;}
  .detail .title span{font-size: 50px;}
  .detail .p{ padding-left: 40px; line-height: 20px;font-size: 14px;}

  .detail-crt{margin: 20px 0;}
  .detail-crt .list{ display: flex; flex-direction: column;}
  .detail-crt .list .item{ width: 100%; margin-bottom: 10px; margin-left: 0;}
}

@media screen and (max-width: 767px){ 
  .search{ top: 22px; right: 80px;width: 220px;}
  .nav .layui-nav{ top: 80px;}
}

/*小屏幕*/
@media screen and (min-width: 768px){
  .nav{max-height: 80px;} 
  .nav .nav-list button{display: none;}
  .nav .layui-nav{width: auto; position: absolute; top: 40px; padding: 0 5px; border-radius: 0; margin: 0;}
  .nav .layui-nav .layui-nav-item{display: inline-block; margin:0 9px; line-height: 40px;} 
  .search{right: 9px;}
}
/* @media screen and (min-width: 768px) and (max-width: 992px){ 
  .nav .layui-nav .layui-nav-item{margin:0 5px;} 
  .search{right: 5px;}
} */
/*大屏幕*/
@media screen and (min-width: 992px){ 
  .nav .layui-nav .layui-nav-item{display: inline-block; margin:0 20px; line-height: 40px;} 
  .search{right: 20px;}
}
/*超大屏幕*/
@media screen and (min-width: 1200px) { 
  .nav .layui-nav .layui-nav-item{display: inline-block; margin:0 35px; line-height: 40px;} 
}
@media screen and (min-width: 1300px) {
  .layui-container{width: 1200px; padding: 0;}
  .main-about .tabJob .content:last-child{margin-bottom: 180px;}
  .nav .nav-logo{position: absolute; top: 0; left: 0;}
  .layui-col-space80{margin: -40px;}
  .layui-col-space80>*{padding: 40px;}
}