﻿/* CSS Document */
/*基础标签重置*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,  caption,tfoot, s { margin:0; padding:0; border:0;  vertical-align:baseline; font-style:normal; text-decoration:none;word-wrap: break-word;font-weight: normal;}
ol,ul { list-style:none;}

.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display:inline-block; }/* Hides from IE-mac \*/
* html .clearfix { height:1%; }
.clearfix { display:block; }/* End hide from IE-mac */

html {font-size: 62.5%;/*10 ÷ 16 × 100% = 62.5%*/  overflow-x:hidden ;  font-family: "ExtraLight";}
body{min-height: 100%; color: #898989; font-family: "ExtraLight";}

.container{position: relative; margin: 0 auto; }
.header{ max-width: 1600px; margin: 0 auto;}
.header .Top { text-align: right;}
.header .Top .item{ font-family: "ExtraLight"; font-size:1vw; padding: 10px 10px; color: #898989; display: inline-block;}

.header .logo{ text-align: center; padding-bottom: 3vw;}
.header .logo img{ text-align: center; width: 12vw;  height: auto; }

.showMenus{ height: 69px;  position: relative; }
.menus { height: 69px;  line-height: 69px; border-bottom: solid 1px #FFF;  width: 100%; margin: 0 auto; left: 0px; top: 0px; z-index: 999; background: #fff;}
.menus ul li{float: left; width: 14.2%; text-align: center;}
.menus ul li:last-child{ margin-right: 0px;}
.menus ul li a{color: #898989; font-family: "ExtraLight"; font-size:1.2vw; height: 100%;}
.menus ul li a:hover{ border-bottom: solid 4px #000; height:65px; display: inline-block;}
.menuFixed{ position:fixed; border-bottom: solid 1px #000;}
.menus ul li.current a{ border-bottom: solid 4px #000; height:65px; display: inline-block;}

.showMenus .menus .twoNav{ position: absolute; left: 0px; top: 68px; width: 100%; height: auto; z-index: 9; display: none;  }
.showMenus .menus .twoNav .navList{ max-width: 1600px; margin: 0 auto; padding: 10px 0px; line-height: 40px; text-align: left; background-color:rgba(0,0,0,0.2);}
.showMenus .menus .twoNav .navList a{ font-size: 12px; height: 30px; border:none; border: solid 1px #535353; background: #535353; margin: 0px 5px; display: inline-block; line-height: 30px;  padding: 0px 10px; color:#FFF}
.showMenus .menus .twoNav .navList a:hover{font-size: 12px; border: solid 1px #535353;  background-color: #FFF; color: #333;}
.showMenus .menus .twoNav .navList a.curr{font-size: 12px; border: solid 1px #535353;  background-color: #FFF; color: #333;}
.showMenus .menus ul li:hover .twoNav{ display: block;}

.home_banner{margin-top: 2vw;}
.banner img{ width: 100%; height: auto; display: block; margin-top: 2vw;}
.home_banner img{ width: 100%; height: auto; display: block;}

.info{ padding: 0px 10%;  margin: 0  auto;}
.info_1 .title{ font-size: 23px; font-family:"Regular"; text-align: center; padding: 20px 0px;}
.info_1 .desc{ font-family: "ExtraLight"; font-size:17px; text-align: center; padding: 0px 10%;}

.info_2{ padding:100px 0%; max-width: 1600px;}
.info_2 img{ width: 100%; height: 30vw; display:block;} 
.info_2 .msg{ width:260px; float: right; text-align: left; padding-top: 20px;}
.info_2 .msg .title{ font-size: 26px; font-family: "Regular"; padding-bottom: 20px;}
.info_2 .msg .desc{ font-size: 16px; font-family: "Regular"; padding-bottom: 20px;}
.info_2 .msg .more{ font-size: 10px; font-family: "Regular"; font-size: 18px;}

.info_2 .leftMsg{ float: left;}

.content{ padding: 50px 0px; margin: 0 auto;}
.address{ margin: 0 auto; max-width:1200px}
.address .title{font-size: 18px; padding: 10px 0px;}
.address .desc{ line-height: 24px;}

.item{ padding: 20px; }
.item .itemImg img{ width: 100%; height:auto; display: block;}
.item .title{ padding: 10px; font-size: 2vw; }

.colorCardInfo{ position: relative;}
.colorCardInfo .right_text{ position: static;}
.cardInfo{  line-height: 26px; position: absolute;  bottom: 0px;}

.prolist{ padding:80px 0px;}
.col_info{ padding: 15px;}
.col_info .title{ font-size:24px; font-weight:bold; font-family: "ExtraLight";}
.col_info .content{font-family: "ExtraLight"; line-height: 24px; font-size:16px;}
.photos{ display: none;}

.detail{ font-size: 18px; font-family: "ExtraLight"; font-weight: normal;}

.color_desc{background-color:rgba(0,0,0,0.6); position: absolute; left: 5px; top: 5px; width:calc(100% - 10px); height:calc(100% - 10px); color: #fff; display: none;}
.color_desc .cont{ padding: 40px 100px; font-size: 18px; height: calc(100% - 80px);  display: flex;display:-webkit-flex;  justify-content: center; -webkit-align-items:center; line-height: 40px; text-align: center;  }
.colorLike:hover .color_desc{ display: block; }

.footTop{ background: #333333; }
.footTop .info{ width: 900px; padding: 40px 150px; padding-bottom: 30px; white-space:nowrap;}
.footTop .info .footLogo{ display: inline-block; float: left;}
.footTop .info .contact{ display: inline-block; float: left; padding-left: 100px;}
.footTop .info .contact .title{font-size: 14px; padding-bottom: 10px; color: #9f9fa0;}
.footTop .info .contact  .desc{ line-height:18px; font-size: 12px; color: #9f9fa0;}
.footTop .follow{display: inline-block; float: left;  padding-left: 100px;}
.footTop .info .follow .title{font-size: 14px; padding-bottom:30px; color: #9f9fa0;}

.footBottom{ background: #2c2c2c; text-align: center; height: 34px; line-height: 34px; font-size: 12px;}

.showDetail{ margin: 0 auto; padding-top:50px; color: #000;}
.showDetail .title{ text-align: center; padding: 50px 0px; font-family: "arial black"; font-size: 40px; font-weight: bold; padding-bottom: 0px; }
.showDetail .infos{ text-align: center; line-height: 36px; font-family: "arial black"; font-size: 14px; padding-top: 50px;}
.showDetail .infos .item{ text-align: center; font-size: 16px; font-family:arial;}
.showDetail .max_width_1000{ max-width: 1000px; margin: 0 auto;}
.max_width_100{ width: 100%; height: auto; display: block;}
.max_width_1200{max-width: 1200px; margin: 0 auto;}
.max_width_1000{ max-width: 1000px; margin: 0 auto;}

.showDetail .desc{padding-top: 50px; font-size: 16px; }
.showDetail .more{ text-align: center;}
.showDetail .more a{ background: #333333; color: #fff; padding: 5px 10px; font-weight: normal; font-family:arial;}
.showDetail .imags{ width: 100%; height: auto; display: inline-block;}
.max_width_850{max-width: 850px; margin: 0 auto;}
.showDetail .marT_100{ margin-top: 100px;}

.showDetail .swiper-slide {text-align: center;font-size: 18px;background: #fff;display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center; -webkit-box-align: center; -ms-flex-align: center;  -webkit-align-items: center;align-items: center;  transition: 300ms; transform: scale(0.5); height: 340px; }
.showDetail .swiper-slide-active,.swiper-slide-duplicate-active{ transform: scale(1.5);}
.showDetail .swiper-container{ height: 340px;}
.showDetail .swiper-container .swiper-slide-prev { height: 444px;}
.showDetail .swiper-container .swiper-slide-prev img{ position: absolute; left:  0px; bottom: 0px; height: 100%;}
.showDetail .swiper-container .swiper-slide-next { height: 444px;}
.showDetail .swiper-container .swiper-slide-next img{ position: absolute; left: 0px; bottom: 0px; height: 100%;}

.showDetail .infos .cDetail{ border: solid 1px #DEDEDE; width: 229px; min-height: 584px; overflow: hidden;}
.showDetail .infos .cDetail .cTitle{ text-align: left; padding: 10px;}
.showDetail .infos .cDetail .cDesc{ font-family: arial; font-size: 12px; padding: 10px; padding-top:0px; text-align: left;}
.showDetail .infos .layui-col-md3{ width: 20%;}

.showDetail .itemRight .item{ text-align: left; color: #999;}
.showDetail .itemRight .padT0{ padding-top: 0px;}
.layui-col-md4 .images{ margin-bottom: 10px; position: relative;}
.layui-col-md4 .images .title{ background-color:rgba(0,0,0,0.5); font-size: 12px; color: #fff; text-align: center; padding: 10px; position: absolute; left: 0px; bottom: 0px; width:calc(100% - 20px); height: auto; font-family: arial; line-height: 24px; display: none;}
.layui-col-md4 .images:hover .title{ display: block;}

.showDetail .sTitle{ background: #87776e; color: #fff; padding: 15px; font-size: 48px; font-family: "arial black"; text-align: center;}
.showDetail .sDesc{ font-size: 16px; line-height:46px; font-family: arial;}
.showDetail .padL-50{ padding-left: 50px;}

.showDetail .sTitle1{font-size: 60px; font-family: "arial black"; text-decoration:underline; text-align: right;}
.showDetail .sDesc1{ text-align: right; padding-top: 20px; line-height: 40px; font-size: 16px; font-family: arial;}

.showDetail .sTitle2{font-size: 60px; font-family: "arial black"; text-decoration:underline; text-align: left;}
.showDetail .sDesc2{ text-align: left; padding-top: 20px; line-height: 40px; font-size: 16px; font-family: arial;}

.showDetail .sTitle3{font-size: 60px; font-family: "arial black"; text-decoration:underline; text-align: left;}
.showDetail .sDesc3{ text-align: left; padding-top: 20px; line-height: 36px; font-size: 16px; font-family: arial;}

.swiper-slide-prev .slideImg .imgLayer{ position: absolute; left: 0px; bottom: 0px; z-index: 99; width: 100%; height: 100%; background-color:rgba(0,0,0,0.3);}
.swiper-slide-next .slideImg .imgLayer{ position: absolute; left: 0px; bottom: 0px; z-index: 99; width: 100%; height: 100%; background-color:rgba(0,0,0,0.3);}

.follow ul li{ float: left; padding: 0px 15px; position: relative;}
.follow ul li .showEwm{ position: absolute; left: -25px; bottom: 35px; border: solid 1px #eee; border-radius: 5px; width: 100px; height: 100px; display: none;}
.follow ul li .showEwm img{width: 100%; height: 100%; display: block;}
.follow ul li a:hover .showEwm{ display: block;}

.newsList .title{ font-size:14px; font-family: "arial black"; text-align: center; padding-top: 15px;}
.mobile{ display: none;}


@media only screen and (max-width:768px) {
  .pc{ display: none;}
  .mobile{ display: block;}
  
  html {font-size:12px;}
  body{min-height: 100%; color: #898989; font-family:arial;}
  
  .mHeader{ height: 60px; position: fixed; left:0px; top: 0px; width: 100%; background: #fff; z-index: 99; box-shadow: 0px 0px 10px #ccc}
  .mHeader .logo{ padding: 10px; float: left; }
  .mHeader .logo img{ height: 40px; width: auto; display: block;}
  .mHeader .mMenus{ float: right; padding: 18px 10px; }
  .mHeader .mMenus .layui-icon{ font-size: 24px;}
  .home_banner{ margin-top:60px;}
  
  .showMmenus{background-color:rgba(0,0,0,0.3); width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; z-index: 999; display: none;}
  .showMmenus .Nav{width: 80%; height: 100%; background: #fff;}
  .showMmenus .Nav ul li{ border-bottom: solid 1px #eee; position: relative;}
  .showMmenus .Nav ul { padding-top: 40px; }
  .showMmenus .Nav ul li a{ height:46px; line-height: 46px; text-indent: 10px; display: block;}
  .showMmenus .Nav ul li font{ position: absolute; right: 8px; top: 14px; color: #ccc;}

  .showMmenus .Nav .navList{ padding-left: 20px;}
  .showMmenus .Nav .navList a{ border-bottom: solid 1px #EEEEEE;}
  .showMmenus .Nav .navList a:last-child{border-bottom: none;}
  
  .info_2{ padding: 50px 0px;}
  .info_2 .msg{ float: none; width:calc(100% - 20px); padding:0px 10px; padding-top: 0px;}
  .info_1{ padding: 10px;}
  .info_1  .title{ font-size: 14px; font-family:arial; font-weight: bold;line-height:24px; padding: 10px 0px;}
  .info_1 .desc{ padding: 0px 10px; font-size: 12px; line-height: 20px; font-family:arial;}
  .info_2 .msg .title{ font-size: 20px; font-weight: bold;}
  .info_2 .msg .more{ font-size: 12px;}
  .info_2 .msg .more a, .info_2 .msg .more a:hover{ color: #F5222D; font-size: 12px;}
  .info_2 .msg .more .layui-icon{ font-size: 10px;}
  .footBottom{ padding: 10px; height: auto; line-height: 24px; background: #333333;}
  .showDetail .title{ font-size: 20px;  padding-left:10px; padding-right:10px;}
  .showDetail .infos .item{ line-height: 28px;}
  .showDetail .infos .layui-col-md3{ width:100%; margin: 0 auto;}
  .showDetail .infos .cDetail{ width: 100%; height: auto; min-height: auto;}
  .showDetail .infos .desc{ padding: 10px;}
  .showDetail img{ width: 100%; height: auto; display: block;}
  .detail{ padding-top: 0px;}
  .banner img{ margin-top: 14vw;}
  .showDetail{padding-top: 0px;}
  .showDetail .infos{ padding-top:0px}
  .mFooter{}
  .mFooter .Top{ background: #2c2c2c; border-bottom: solid 1px #9f9fa0;padding: 0px 10%;}
  .mFooter .Top ul li{ width: 25%; text-align: center; float: left; padding: 20px 0px;}
  .mFooter .Top ul li .showEwm{ display: none;}
  .mFooter .Bottom img{ width: 100%; height: auto; display: block;}
  
  .cardInfo{position: static;  padding-left:20px;}
  .cardInfo .content{ padding: 0px;}
  .info_2{ padding-top: 0px;}
  .showPhotoss{ padding: 20px; padding-top: 80px; display: block;}
  
  .color_desc .cont{ padding: 40px 20px; font-size: 14px; line-height: 22px;}
  .showDetail .sTitle1, .showDetail .sTitle2{ text-align: left; padding-left: 10px; font-size: 30px;}
  .showDetail .sDesc1, .showDetail .sDesc2{ text-align: left; padding: 10px; line-height: 28px;}
  .showDetail .sTitle3 img{ width: auto; height: auto; display:block; margin: 0 auto;}
  .mShowEwm{ display: none;}

  .info_2 img{ width: 100%; height: auto; display:block;} 
}
