@charset "utf-8";

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins.eot');
  src: url('../fonts/Poppins.eot?#iefix') format('embedded-opentype'),
  url('../fonts/Poppins.woff2') format('woff2'),
  url('../fonts/Poppins.woff') format('woff'),
  url('../fonts/Poppins.ttf') format('truetype'),
  url('../fonts/Poppins.svg#Poppins') format('svg');
  font-weight: normal;
  font-style: normal;
}

.searHeight{font-style:normal; color:#d82128 !important;}

/* CSS Document */
html, body {font-size: 12px;margin: 0px;padding: 0px;text-decoration: none;font-family:'Poppins',Arial,Helvetica,sans-serif;background: #fff;text-align: left;-webkit-text-size-adjust: none;}
a { color: #666666;text-decoration: none;outline: 0px none; star:expression(this.onFocus=this.blur());}
a:hover, a:active { color: #d82128;}
* { margin: 0px;padding: 0px;list-style: none;}
table { border-collapse: collapse;}
ul, li {list-style: none;border: 0 none;padding: 0px;}
form {margin: 0px;}
img {border: 0px none;text-align-last: center;vertical-align: middle;_azimuth:expression(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "images/blank.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("', '').replace('")', ''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')", this.runtimeStyle.backgroundImage = "none")), this.pngSet=true);}
center {text-align: left; color: #999;height: 50px;}
#dhtmltooltip {z-index: 100;visibility: hidden; position: absolute;text-align: left;border: 1px solid #ccc;}
#clear, .clear {clear: both;float: none!important;background: none;width: 0 !important; height: 0 !important;}
#noData, .noData {color: #ccc;font-size: 14px;text-align: left;padding: 50px 0px;}
.fl-left{ float:left;}
.fl-right{ float:right;}
.my-skin .layui-layer-btn a{background-color:#666;border:1px solid #666;}


.pages {
  /*float:right;*/
  margin-top: 16px
}
.pages a, .pages span {
  display: inline-block;
  padding: 0 11px;
  height: 28px;
  border: 1px solid #e6e6e6;
  border-radius: 3px;
  line-height: 28px;
  margin-right: 3px;
  text-align: center;
  color: #909090;/*cursor:pointer*/
}
.pages a:hover {
  border-color: #C8D0D1;
  text-decoration: none
}
.pages input {
  width: 28px;
  height: 28px;
  border: 1px solid #e6e6e6;
  outline: 0;
  text-align: center;
  line-height: 28px;
  vertical-align: top
}
.pages .special-span {
  border: 0;
  margin-right: 0;
  cursor: auto
}
.pages .span {
  margin-left: 15px;
  margin-right: 3px
}
.pages .current {
  color: #ffffff;
  background-color: #CF2C15;
  border-color: #B9220D;
}


/*head TOP*/

#head{ position:absolute; z-index:1001; left:0; top:0; width:100%; transition:all .35s;}
#head .wrap{ position:relative; width:90%; margin:0 auto;}
#head .logo{ text-align:left;}
#head .logo>a{ display:block; width:180px; height:120px; text-align:center; background:#fff; border-radius:0 0 30px 0; overflow:hidden; transition:all .35s;}
#head .logo>a img{ height:46px; width:auto; margin:36px auto 12px auto; transition:all .35s;}
#head .logo>a img.logo-red{ display:none;}
#head .logo>a .slogan{ height:9px!important; margin-top:0 !important;}
#head .menu{ width:60%; padding-right:30px; text-align:right;}
#head .menu>.btn{ display:none; transition:all .35s;}
#head .menu>ul{line-height:80px;}
#head .menu>ul>li{ position:relative; display:inline-block;}
#head .menu>ul>li:last-child{ background:none !important;}
#head .menu>ul>li>a{position:relative; margin:0 13px; font-size:16px; font-family:"Arial"; color:rgba(255,255,255,.9); text-align:left; line-height:30px; display:inline-block; transition:all .25s;}
#head .menu>ul>li>a:after{ position:absolute; z-index:3; left:0; bottom:0; width:0; height:2px; background:#d82128; content:''; transition:all .35s;}
#head .menu>ul>li.A>a{ color:#d82128;}
#head .menu>ul>li.A>a:hover:after, #head .menu>ul>li.A>a:after{ width:100%;}
#head .menu>ul>li>div{position:absolute; z-index:99; left:0; top:60px; min-width:230px; height:auto; overflow:hidden; display:none; transition:top .35s;}
#head .menu>ul>li>div a{ position:relative; display:block; width:80%; background: rgba(0,0,0,.1); margin-bottom:1px; line-height:24px; padding:8px 10%; font-size:14px;font-family:"Arial"; color:rgba(255,255,255,.8); text-align:left; transition:all .35s;}
#head .menu>ul>li>div a:hover{ color:#fff; background:#d82128;}
#head .search{ position:relative; width:50px; height:80px; text-align:center;}
#head .search>a{ position:absolute; z-index:1; left:50%; top:50%; margin-left:-16px; margin-top:-16px; display:block; width:32px; height:32px; line-height:32px; text-align:center; background:#d82128 url("../images/icon-search.png") no-repeat; background-position:50% 50%; background-size:18px auto; border-radius:5px; transition:all .35s;}
#head .search>a:hover{ opacity:.8;}
#head .language{ position:relative; padding-top:20px; text-align:center;}
#head .language>a{ position:relative; display:block; color:#999; height:40px; line-height:40px;}
#head .language>a>img{ width:auto; height:24px; margin-right:6px; opacity:.7;}
#head .language>div{ display:none; position:absolute; z-index:2; left:10px; top:60px; width:100%; height:auto; background:rgba(0,0,0,.8); text-align:left;}
#head .language>div>a{ display:block; font-size:13px; padding:6px 15px; color:rgba(255,255,255,.8); transition:all .35s;}
#head .language>div>a:hover{ background:#d82128}


#head.small{ position:fixed; background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);}
#head.small .logo>a{ width:90px; height:50px;border-radius:0 0 0 0; }
#head.small .logo>a img{ height:22px; width:auto; margin:15px auto 0 auto;}
#head.small .logo>a .slogan{ display:none;}
#head.small .menu>ul{line-height:50px;}
#head.small .menu>ul>li>a{font-size:14px; color:rgba(0,0,0,.6); line-height:30px; display:inline-block; transition:all .25s;}
#head.small .menu>ul>li>div{ background:#ddd; top:50px;}
#head.small .menu>ul>li>div a{ color:rgba(0,0,0,.8);}
#head.small .menu>ul>li>div a:hover{ color:#fff;}
#head.small .search{ height:50px;}
#head.small .search>a{ background:transparent url("../images/icon-search-black.png") no-repeat; background-position:50% 50%; background-size:18px auto;}
#head.small .language{ padding-top:6px;}
#head.small .language>a{color:rgba(0,0,0,.5);}


#head.proview{position:fixed; background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);}
#head.proview .logo>a{ width:120px; height:90px;border-radius:0 0 0 0; }
#head.proview .logo>a img{ height:36px; width:auto; margin:28px auto 0 auto;}
#head.proview .logo>a .slogan{ display:none;}
#head.proview .menu>ul{line-height:90px;}
#head.proview .menu>ul>li>a{font-size:16px; color:rgba(0,0,0,.6); line-height:30px; display:inline-block; transition:all .25s;}
#head.proview .menu>ul>li>div{ background:#ddd;}
#head.proview .menu>ul>li>div a{ color:rgba(0,0,0,.8);}
#head.proview .menu>ul>li>div a:hover{ color:#fff;}
#head.proview .search{ height:90px;}
#head.proview .search>a{ background:transparent url("../images/icon-search-black.png") no-repeat; background-position:50% 50%; background-size:18px auto;}
#head.proview .language{ padding-top:0!important;}
#head.proview .language>a{ height:90px; line-height:90px; color:rgba(0,0,0,.5);}

#menuWap{ display:none;}

@media only screen and (max-width: 1280px){
  #head .logo>a{ width:160px; height:107px;}
  #head .logo>a img{ height:42px; margin:32px auto 12px auto;}
  #head .menu>ul>li>a{margin:0 10px; font-size:16px;}
}

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

  #head{ height:40px;position:fixed; background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);}
  #head .wrap{ width:100%;}
  #head .logo{ position:absolute; z-index:99; left:0; top:0; }
  #head .logo>a{ width:100px; height:40px;background:transparent!important;}
  #head .logo>a img{ height:16px; margin-top:12px;}
  #head .logo>a img.logo-white{ display:none;}
  #head .logo>a img.logo-red{ display:block;}
  #head .menu{ position:absolute; right:20px; top:0; width:auto; padding-right:0!important;}
  #head .menu>.btn{ display:block; width:40px; height:40px; line-height:40px; text-align:center;}
  #head .menu>.btn>img{ height:24px; width:auto;}
  #head .menu>ul{ display:none!important;}
  #head .search{ position:absolute; right:60px; top:0; height:40px;}
  #head .search>a{ background:transparent url("../images/icon-search-black.png") no-repeat; background-position:50% 50%; background-size:18px auto;}
  #head .language{ display:none;}


  #head.small .logo>a{ width:100px; height:40px;}
  #head.small .logo>a img{ height:16px; width:auto; margin:12px auto 0 auto;}
  #head.small .search{ height:40px;}


  #head.proview{ height:40px;}
  #head.proview .logo{ position:absolute; z-index:99; left:0; top:0; }
  #head.proview .logo>a{ width:100px; height:40px;background:transparent!important;}
  #head.proview .logo>a img{ height:16px; margin-top:12px;}
  #head.proview .logo>a img.logo-white{ display:none;}
  #head.proview .logo>a img.logo-red{ display:block;}
  #head.proview .menu{ position:absolute; right:20px; top:0; width:auto; padding-right:0!important;}
  #head.proview .menu>.btn{ display:block; width:40px; height:40px; line-height:40px; text-align:center;}
  #head.proview .menu>.btn>img{ height:24px; width:auto;}
  #head.proview .menu>ul{ display:none!important;}
  #head.proview .search{ position:absolute; right:60px; top:0; height:40px;}
  #head.proview .language{ display:none;}

  #menuWap{ position:fixed; z-index:1002; right:0; top:0; width:100%;height:100%;}
  #menuWap>.close{ position:absolute; z-index:10; top:0; right:0; width:40px; height:40px; background:#d82128 url("../images/icon-close.png") no-repeat; background-position:50% 50%; background-size:20px auto;}
  #menuWap>.menu {position: absolute;z-index: 9;right: -70%;top: 0px;width: 70%;height: 100%; padding: 15% 0px;background: #fff; box-shadow: 0px 2px 8px rgba(0,0,0,.3); overflow: hidden;}
  #menuWap>.menu>ul{ width:78%; margin:0 auto;}
  #menuWap>.menu>ul>li { position:relative;display: block;width: 100%;padding: 15px 0px;text-align: left;margin: 0px auto;border-bottom: 1px solid #eee;}
  #menuWap>.menu>ul>li>a {display:block; font-size: 16px;padding:0px 5px;}
  #menuWap>.menu>ul>li.A>a{ color:#d82128 !important;}
  #menuWap>.menu>ul>li>div{ display:none; padding:10px 0px;}
  #menuWap>.menu>ul>li>div a{display:block;padding:5px;font-size:14px; color:#999;}
  #menuWap>.menu>.language{ position:relative; width:120px; left:11%; top:20px;}
  #menuWap>.menu>.language>a{ position:relative; display:block; color:#999; height:40px; line-height:40px;}
  #menuWap>.menu>.language>a:after{ position:absolute; z-index:4; left:60%; top:50%; margin-top:-3px; width: 0;height: 0; border-width: 6px; border-style: solid;border-color: #ccc transparent transparent transparent; content:''; transition:all .35s;}
  #menuWap>.menu>.language>a>img{ width:auto; height:18px; margin-right:6px; opacity:.7;}
  #menuWap>.menu>.language>div{ display:none; position:absolute; z-index:2; left:0; top:40px; width:100%; height:auto; padding:5px 0; background:#d82128; text-align:left;}
  #menuWap>.menu>.language>div>a{ display:block; padding:5px 10px; color:rgba(255,255,255,.8); transition:all .35s;}
  #menuWap>.bg{ position:fixed; z-index:1; left:0; top:0; width:0; height:0; background:0; transition:all .2s;}
  #menuWap>.show{width:100%; height:100%; background:rgba(0,0,0,.5);}

}
@media only screen and (max-width: 420px){

  #head{ height:50px;}
  #head .logo>a{ height:50px;}
  #head .logo>a img{ height:20px; margin-top:16px;}
  #head .menu{ right:10px;}
  #head .menu>.btn{ width:50px; height:50px; line-height:50px;}
  #head .search{ right:50px; height:50px;}

  #head.small .logo>a{ width:100px; height:50px;}
  #head.small .logo>a img{ height:20px; margin:16px auto 0 auto;}
  #head.small .search{ height:50px;}

  #head.proview{ height:50px;}
  #head.proview .logo>a{ height:50px;}
  #head.proview .logo>a img{ height:20px; margin-top:16px;}
  #head.proview .menu{ right:10px;}
  #head.proview .menu>.btn{ width:50px; height:50px; line-height:50px;}
  #head.proview .search{right:50px; height:50px;}
  #menuWap>.menu>ul>li>a {font-size: 14px;}
  #menuWap>.menu>ul>li>div a{font-size:12px;}
}

/*END*/

/*sear TOP*/

#sear{display:none; position:fixed; z-index:1002; left:50%; top:70px; width:84%; height:32px; margin-left:-42%;}
#sear>form{ position:absolute; z-index:1; top:0; right:0; width:300px;background-color:rgba(216,40,33,1); border-radius:3px; overflow:hidden;}
#sear>form input[type="text"]{float:left;height:32px;line-height:32px;padding-left:15px;width:80%;border:none;background-color:transparent;color:#fff;box-sizing:border-box;overflow:hidden;}
#sear>form input::-webkit-input-placeholder, #sear>form textarea::-webkit-input-placeholder {color: rgba(255,255,255,.5);}
#sear>form button{float:right;width:20%;height:32px;border:none;background: url(../images/icon-search.png) no-repeat center center; background-size:auto 50%;color:#fff;border-left:1px solid rgba(255,255,255,.2);cursor:pointer;box-sizing:border-box;overflow:hidden;}
#sear.small{ top:60px;}

@media only screen and (max-width: 960px){
  #sear{ top:50px; width:90%;margin-left:-50%;padding:10px 5%; background:rgba(216,40,33,.8);}
  #sear>form{ position:relative; width:100%;  border-radius:0!important;}
  #sear>form input[type="text"]{background-color:#fff;color:#666;}
  #sear>form input::-webkit-input-placeholder, #sear>form textarea::-webkit-input-placeholder {color: rgba(0,0,0,.5);}
  #sear>form button{background:#333 url(../images/icon-search.png) no-repeat center center;background-size:auto 50%;}
  #sear.small{ top:50px;}
}


/*END*/






/*banner TOP*/

#banner{position:relative;background:#fff; height:auto; overflow:hidden; transition:all .35s;}

#banner .mc-box1{ position:absolute; z-index:92; top:36%; right:10%; width:40%; text-align:left;}
#banner .mc-box1>.tit{ font-size:50px; font-weight:bold; color:#d82128;}
#banner .mc-box1>.txt1{ padding:6px 0; font-size:24px; color:rgba(255,255,255,.8);}
#banner .mc-box1>.txt2{ font-size:18px; color:rgba(255,255,255,.2);}

#banner .mc-box2{ position:absolute; z-index:92; top:36%; right:12%; width:24%; text-align:left;}
#banner .mc-box2>.txt{ font-size:18px; color:rgba(255,255,255,.8); line-height:24px;}
#banner .mc-box2>.slogan{ width:68%; padding:20px 0; text-align:left;}
#banner .mc-box2>.slogan>div{ padding:5px 10px; background:rgba(216,33,40,.8); margin-bottom:3px; font-size:14px; color:#fff;}

#banner .mc-box3{ position:absolute; z-index:92; top:36%; right:10%; width:30%; text-align:left;}
#banner .mc-box3>.tit{ font-size:26px; font-weight:bold; color:#d82128;}
#banner .mc-box3>.txt1{ padding:6px 0; font-size:18px; line-height:24px; color:rgba(255,255,255,.8);}

#banner .swiper-container{ position:relative; width:100%; height:100%;}
#banner .swiper-slide{ width:100%; height:100%; overflow:hidden; text-align:center; 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;}
#banner .swiper-slide img{width:100%; height:auto;}
#banner .swiper-slide .mob{display:none;}

@media only screen and (max-width: 1460px){
  #banner .mc-box1{ right:8%;}
  #banner .mc-box1>.tit{ font-size:42px;}

}
@media only screen and (max-width: 960px){
  #banner .mc-box1{ display:none;}
  #banner .mc-box2{ display:none;}
  #banner .swiper-slide .pc{display:none;}
  #banner .swiper-slide .mob{display:block;}
  #banner .swiper-button-next, #banner .swiper-button-prev {width: 28px;height: 46px;margin-top: -23px;background-size: 28px 46px;}
}

@media only screen and (max-width: 420px){
  #banner .swiper-button-next, #banner .swiper-button-prev {width: 14px;height: 23px;margin-top: -11px;background-size: 14px 23px;}
}

/*END*/



/*head TOP*/

#main{ position:relative; width:100%; margin:0 auto;}
#main .wrap{ width:92%; max-width:1260px; margin:0 auto;}
#main .catalog{ position:relative; z-index:99; top:-120px; height:120px; margin:0 auto;}
#main .catalog>.wrap{max-width:inherit;}
#main .catalog .swiper-container {width: 100%;height: auto;margin:0 auto;}
#main .catalog .swiper-slide {text-align: center;background:none;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;}
#main .catalog .swiper-slide a{ display:block; width:100%;background:rgba(0,0,0,.5); height:110px; padding-top:10px; transition:all .35s; overflow:hidden;}
#main .catalog .swiper-slide a .img{ width:30%; text-align:center;}
#main .catalog .swiper-slide a .img>img{width:80%; height:auto; margin:0 auto;}
#main .catalog .swiper-slide a .name{ width:62%; padding:30px 5% 0 0; line-height:20px; color:#fff; font-size:16px; text-align:left;}
#main .catalog .swiper-slide a:hover{ background:rgba(216,33,40,.9)}
#main .catalog .swiper-pagination{ display:none; z-index:99; left:50%; width:80%; margin-left:-40%; bottom:-20px; text-align:center;}
#main .catalog .swiper-pagination .swiper-pagination-bullet {width: 30px;height: 2px;display: inline-block; margin:0 6px; border-radius: 2px;background: #000;opacity: .2; transition:all .35s;}
#main .catalog .swiper-pagination .swiper-pagination-bullet-active { width:60px; opacity: 1;background: #d82128;}

#main .solutions{}
#main .solutions .title{ text-align:center; margin:0 auto;}
#main .solutions .title>.tit1{ padding:20px 0 0; position:relative; font-size:30px; color:#333; margin:0 auto;}
#main .solutions .title>.tit{ padding:0; position:relative; font-size:22px; color:#ccc; margin:0 auto;width: 120px;}
#main .solutions .title>.tit:after{ position:absolute; left:50%; bottom:0; width:60px; height:1px; margin-left:-30px; background:#d82128; content:''; transition:all .35s;}
#main .solutions .title>.txt{ padding:20px 100px; font-size:14px; color:#999;}
#main .solutions .container{ position:relative; padding:50px 0; margin:0 auto;}
#main .solutions .container .button-next{ position:absolute; z-index:88; top:50%; right:-40px; margin-top:-120px; width:50px; height:50px; cursor:pointer; opacity:.2; background: url("../images/arrow-r-black-solutions.png") no-repeat; background-position:50% 50%; background-size:50px auto; transition:all .35s;}
#main .solutions .container .button-next:hover{ opacity:.6;}
#main .solutions .container .button-prev{ position:absolute; z-index:88; top:50%; left:-50px; margin-top:-120px; width:50px; height:50px; cursor:pointer; opacity:.2; background: url("../images/arrow-l-black-solutions.png") no-repeat; background-position:50% 50%; background-size:50px auto; transition:all .35s;}
#main .solutions .container .button-prev:hover{ opacity:.6;}
#main .solutions .container .swiper-pagination{ position:relative!important; width:100%;margin:0 auto; padding:50px 0 0 0;}
#main .solutions .container .swiper-pagination .swiper-pagination-bullet {width: 10px;height: 10px; margin:0 3px; display: inline-block;border-radius: 100%; border:2px solid #000; background: #000;opacity: .2;}
#main .solutions .container .swiper-pagination .swiper-pagination-bullet-active {opacity: 1; border:2px solid #e62129; background: #fff;}
#main .solutions .container a{ position:relative; z-index:2; display:block; width:360px;margin: 0 2px padding-bottom:50px; overflow:hidden; text-align:left; transition:all .35s;}
#main .solutions .container a>.img{ margin:0 auto;border:#d82128 1px solid;}
#main .solutions .container a>.img>img{ width:100%; height:auto; margin:0 auto;}
#main .solutions .container a>.con>.name{ width:80%; margin:0 auto; padding:25px 0; font-size:24px; color:#d82128; transition:all .35s;}
#main .solutions .container a>.con>.text{ width:80%; margin:0 auto; padding:10px 0; font-size:14px; line-height:24px; color:#999; transition:all .35s;}
#main .solutions .container a>.con>.more{ width:80%; margin:0 auto; padding:0; text-align:left;}
#main .solutions .container a>.con>.more>img{ height:24px; width:auto;}
#main .solutions .container a:hover{ z-index:99; transform:scale(1.1); background:#d82128;}
#main .solutions .container a:hover .name{ color:#fff;}
#main .solutions .container a:hover .text{ color:rgba(255,255,255,.8);}

#main .product{ display:none; margin:0 auto;background:#eee;}
#main .product .title{ text-align:center; margin:0 auto;}
#main .product .title>.tit{ padding:30px 0; position:relative; font-size:36px; color:#333; margin:0 auto;}
#main .product .title>.tit:after{ position:absolute; left:50%; bottom:0; width:60px; height:1px; margin-left:-30px; background:#d82128; content:''; transition:all .35s;}
#main .product .title>.txt{ padding:20px 100px; font-size:14px; color:#999;}
#main .product .container{ position:relative; padding:30px 0; margin:0 auto;}
#main .product .container .swiper-container {width: 100%;height: auto;margin:0 auto;}
#main .product .container .swiper-slide {text-align: center;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;}
#main .product .container .swiper-slide a{ display:block; position:relative; margin:0 auto; overflow:hidden;}
#main .product .container .swiper-slide .img{ position:relative; width:100%; height:auto; overflow:hidden; margin:0 auto;}
#main .product .container .swiper-slide .img>img{ width:80%; padding:10%; height:auto; margin:0 auto; transition:all .35s;}
#main .product .container .swiper-slide .name{ position:absolute; z-index:9; left:0; bottom:0; width:90%; height:50px; line-height:50px; padding:0 5%; background:rgba(0,0,0,.5); color:#fff; text-align:left; font-size:14px; transition:all .35s;}
#main .product .container .swiper-slide .name:after{ position:absolute; right:0; bottom:0; width:50px; height:100%; background:#d82128 url("../images/logo.png") no-repeat; background-position:50% 50%; background-size:40px auto; content:''; transition:all .35s;}
#main .product .container .button-prev{ position:absolute; z-index:9; top:50%; left:-70px; width:50px; height:50px; margin-top:-25px; cursor:pointer; background:url("../images/arrow-l.png") no-repeat; background-size:100% 100%;}
#main .product .container .button-next{ position:absolute; z-index:9; top:50%; right:-70px; width:50px; height:50px; margin-top:-25px; cursor:pointer; background:url("../images/arrow-r.png") no-repeat; background-size:100% 100%;}
#main .product .container .swiper-button-disabled{ opacity:.2;}
#main .product .container a:hover .img>img{transform:scale(1.2);}
#main .product .container a:hover .name{ height:60px; background:rgba(0,0,0,.7);}
#main .product .container a:hover .name:after{ width:60px;}
#main .product .more{ text-align:center;}
#main .product .more>a{display:inline-block; padding:10px 60px; color:#888; font-size:16px; border:1px solid #ddd; background:none; border-radius:3px; transition:all .35s;}
#main .product .more>a:hover{ color:#d82128; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.1);}


#main .series{ margin:0 auto; padding:40px 0; background:#eee;}
#main .series .title{ text-align:center; margin:0 auto;}
#main .series .title>.tit{ padding:30px 0; position:relative; font-size:36px; color:#333; margin:0 auto;}
#main .series .title>.tit:after{ position:absolute; left:50%; bottom:0; width:60px; height:1px; margin-left:-30px; background:#d82128; content:''; transition:all .35s;}
#main .series .title>.txt{ padding:20px 100px; font-size:14px; color:#999;}
#main .series .focus{ position:relative; padding:50px 0; margin:0 auto;}
#main .series .focus .bimg{ position:relative; width:100%; height:auto;}
#main .series .focus .bimg .swiper-wrapper:hover{z-index:11; position:relative;}
#main .series .focus .bimg .swiper-slide img{max-width:100%; max-height:100%;}
#main .series .focus .bimg .swiper-container{width:100%; height:100%;}
#main .series .focus .img{ position:absolute; z-index:3; left:50%; bottom:0; width:402px; margin-left:-201px;}
#main .series .focus .img .swiper-container{width:402px; height:80px; margin:auto; text-align:center;}
#main .series .focus .img .swiper-slide{width:auto; height:71px;}
#main .series .focus .img img{padding:1px; width:auto; height:100%; display:block; border:1px solid transparent; box-sizing:border-box;}
#main .series .focus .img .active-nav img{padding:0; border:1px solid #d82128 !important;}
#main .series .focus .img .active-nav{position:relative; z-index:11;}
#main .series .focus .img .arrow-left{ position:absolute; z-index:99; left:-50px; top:50%; margin-top:-15px; width:30px; height:30px; background:rgba(0,0,0,.2) url("../images/arrow-l-white.png") no-repeat; background-position:50% 50%; background-size:14px auto; border-radius:100%; cursor:pointer; transition:all .35s;}
#main .series .focus .img .arrow-right{ position:absolute; z-index:99; right:-50px; top:50%; margin-top:-15px; width:30px; height:30px; background:rgba(0,0,0,.2) url("../images/arrow-r-white.png") no-repeat; background-position:50% 50%; background-size:14px auto; border-radius:100%; cursor:pointer; transition:all .35s;}
#main .series .focus .img .arrow-left:hover, #main .series .focus .img .arrow-right:hover{ background-color:rgba(0,0,0,.4);}



#main .news{ padding-top:40px; margin:0 auto; border-bottom:1px solid #ddd;}
#main .news .title{ text-align:center; margin:0 auto;}

#main .news .title>.tit1{ padding:20px 0 0; position:relative; font-size:30px; color:#333; margin:0 auto;}
#main .news .title>.tit{ padding:0; position:relative; font-size:22px; color:#ccc; margin:0 auto;width: 120px;}

#main .news .title>.tit:after{ position:absolute; left:50%; bottom:0; width:60px; height:1px; margin-left:-30px; background:#d82128; content:''; transition:all .35s;}
#main .news .title>.txt{ padding:20px 100px; font-size:14px; color:#999;}
#main .news .container{ position:relative; margin:0 auto; padding:60px 0;}
#main .news .container .swiper-pagination{ position:relative!important; width:100%;margin:0 auto; padding:50px 0;}
#main .news .container .swiper-pagination .swiper-pagination-bullet {width: 10px;height: 10px; margin:0 3px; display: inline-block;border-radius: 100%; border:2px solid #000; background: #000;opacity: .2;}
#main .news .container .swiper-pagination .swiper-pagination-bullet-active {opacity: 1; border:2px solid #e62129; background: #fff;}
#main .news .container a{ display:block; background:#eee; transition:all .35s;}
#main .news .container a>.img{ position:relative; max-height:250px; margin:0 auto; text-align:center; overflow:hidden;}
#main .news .container a>.img:after{ position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5); opacity:0; content:''; transition:all .35s;}
#main .news .container a>.img>img{ width:100%; height:auto; margin:0 auto; transition:all 1.2s;}
#main .news .container a>.text{ position:relative; text-align:left; padding:20px; height:140px;}
#main .news .container a>.text .time{ position:absolute; z-index:3; left:20px; top:-30px; width:105px; height:30px; line-height:30px; padding:0 20px; background:rgba(216,33,40,.9); font-size:12px; color:#fff;}
#main .news .container a>.text .name{ display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2;overflow: hidden; font-size:18px; color:#333; height:46px; line-height:24px; margin:20px auto;}
#main .news .container a>.text .txt{ height:40px; font-size:14px; color:#999; line-height:20px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2;overflow: hidden;}
#main .news .container a:hover .img>img{transform:scale(1.2);}
#main .news .container a:hover .img:after{ opacity:1;}
#main .news .container a:hover .name{ color:#d82128;}
#main .news .container a:hover{ background:#f5f5f5;}

#main .network{padding-top:40px; margin:0 auto;padding-bottom: 40px;}
#main .network>.wrap{ }
#main .network .title{ max-width:1260px; text-align:center; margin:0 auto;}
/*#main .network .title>.tit{ padding:30px 0; position:relative; font-size:36px; color:#333; margin:0 auto;}*/

#main .network .title>.tit1{ padding:20px 0 0; position:relative; font-size:30px; color:#333; margin:0 auto;}
#main .network .title>.tit{ padding:0; position:relative; font-size:22px; color:#ccc; margin:0 auto;width: 120px;}



#main .network .title>.tit:after{ position:absolute; left:50%; bottom:0; width:60px; height:1px; margin-left:-30px; background:#d82128; content:''; transition:all .35s;}
#main .network .title>.txt{ padding:20px 100px; font-size:14px; color:#999;}
#main .network .container{ position:relative; padding-top:40px; margin:0 auto;}
#main .network .container .footprint{ position:absolute; z-index:99; left:50%; width:100%; height:350px; margin-left:-50%; text-align:center;}
#main .network .container .footprint>a{ width: 24%;position:relative; display:inline-block; height:350px; border-bottom:3px solid #d82128; overflow:hidden; transition:all .35s;}
#main .network .container .footprint>a:after{ position:absolute; z-index:2; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.1); content:''; transition:all .35s;}
#main .network .container .footprint>a:before{ position:absolute; z-index:4; left:16%; top:0; width:1px; height:0; background:rgba(255,255,255,.2); content:''; transition:all .35s;}
#main .network .container .footprint>a>.img{ margin:0 auto;}
#main .network .container .footprint>a>.img>img{ width:100%; height:auto;}
#main .network .container .footprint>a>.name{ position:absolute; z-index:9; left:50%; bottom:20px; width:80%; margin-left:-40%; text-align:left; font-size:24px; font-weight:bold; color:#fff; transition:all .35s;}
#main .network .container .footprint>a>.more{ position:absolute; z-index:8; left:50%; bottom:-20px; width:80%; margin-left:-40%; text-align:left; font-size:14px; color:#fff; transition:all .35s;}
#main .network .container .footprint>a>.more>img{height:18px; width:auto;}
#main .network .container .footprint>a:hover:after{ background:rgba(0,0,0,.8);}
#main .network .container .footprint>a:hover:before{ height:40%;}
#main .network .container .footprint>a:hover .name{ bottom:60px;}
#main .network .container .footprint>a:hover .more{ bottom:20px;}
#main .network .container .item {position: absolute;width: 100%;height: 100%;left:0;top:0;}
#main .network .container .item>div {width:20px;height:20px;position: absolute; z-index:88; background:url("../images/footprint-point.png") no-repeat; background-size:100% auto; border-radius:100%; cursor:pointer; transform: translateZ(0);will-change: transform, border-radius;}
#main .network .container .item>div:before {content: "";box-sizing: border-box;width: 40px; height: 40px;position: absolute; left: 50%; top: 50%; margin-top: -20px; margin-left: -20px; border-radius: 50%; box-shadow: 0 0 6px 1px #ce1b2e; transform: scale(0); opacity: 1; will-change: transform, opacity;}
#main .network .container .item.red div { margin-left:6px; margin-top:6px; width:9px; height:9px; background: #ce1b2e;animation: scaled-rect 1s infinite; animation-timing-function: ease-in-out;}
#main .network .container .item.red div:before {animation: out-circle 1s infinite;animation-timing-function: ease-in;}
#main .network .container .footprint1 div:first-child {left: 48%;top: 52%;}
#main .network .container .footprint1 div:nth-child(2) {left: 57%;top: 63%}
#main .network .container .footprint1 div:nth-child(3) {left: 55.4%;top: 71%}
#main .network .container .footprint1 div:nth-child(4) { left: 54.2%;top: 67.4%}
#main .network .container .footprint2 div:first-child { left: 25.7%;top: 69%}
#main .network .container .footprint3 div:first-child {left: 74.6%;top: 59.4%}
#main .network .container .footprint3 div:nth-child(2) {left: 64%;top: 38.6%}
#main .network .container .footprint4 div:first-child {left: 52.7%; top: 37.5%}
#main .network .container .footprint4 div:nth-child(2) {left: 53.5%;top: 36.2%}
#main .network .container .map{ margin:0 auto; text-align:center;}
#main .network .container .map>img{max-width:100%; height:auto; margin:0 auto;}

@media only screen and (max-width: 1460px){
  #main .wrap{ max-width:1200px;}
  #main .catalog .item>a .name{font-size:14px;}
  #main .network .container .footprint{  width:1200px; height:auto; margin-left:-600px;}
  #main .network .container .footprint>a{ float:left; width:24.6%; height:auto; margin-left:2px;}
  #main .network .container .footprint>a>.name{ font-size:22px;}

  #main .network .container .footprint1 div:first-child {left: 47.4%;top: 52%;}
  #main .network .container .footprint1 div:nth-child(2) {left: 56.4%;top: 63%}
  #main .network .container .footprint1 div:nth-child(3) {left: 55%;top: 71%}
  #main .network .container .footprint1 div:nth-child(4) { left: 53.8%;top: 67.4%}
  #main .network .container .footprint2 div:first-child { left: 24.4%;top: 69%}
  #main .network .container .footprint3 div:first-child {left: 75.8%;top: 59.4%}
  #main .network .container .footprint3 div:nth-child(2) {left: 64%;top: 38.6%}
  #main .network .container .footprint4 div:first-child {left: 52.7%; top: 37.5%}
  #main .network .container .footprint4 div:nth-child(2) {left: 53.5%;top: 36.2%}
}

@media only screen and (max-width: 1260px){
  #main .news .container a>.img{ max-height:200px;}
  #main .network .title{ max-width:1000px;}
  #main .network .container .footprint{ width:94%; margin-left:-46%;}
  #main .network .container .footprint>a>.name{ font-size:18px;}
}
@media only screen and (max-width: 1020px){
  #main .network .container .footprint>a>.name{ font-size:16px;}
}

@media only screen and (max-width: 960px){
  #main .wrap{ width:100%; max-width:inherit;}
  #main .catalog{ top:0; height:auto;}

  #main .catalog .swiper-slide a{ padding-top:0;background:rgba(0,0,0,.8);  height:60px;}
  #main .catalog .swiper-slide a .img>img{width:68%;}
  #main .catalog .swiper-slide a .name{padding:15px 5% 0 0;font-size:13px; line-height:16px;}

  #main .solutions{width:92%; margin:0 auto;}
  #main .solutions .title>.tit{ font-size:30px;}
  #main .solutions .container{ padding:40px 0;}
  #main .solutions .container a{ width:90%; padding-bottom:0px; margin:0 auto;}
  #main .solutions .container a>.con>.name{ font-size:18px; padding:6px 0;}
  #main .solutions .container a>.con>.text{ line-height:20px; padding:0;}
  #main .solutions .container a>.con>.more>img{ height:18px;}
  #main .product{ margin:0 auto; padding:60px 0; background:#eee;}
  #main .product .title>.tit{ font-size:30px;}
  #main .product .container{ width:92%; padding:40px 0;}
  #main .product .container>.swiper-container{ width:90%;}
  #main .product .container .swiper-slide .name{ height:40px; line-height:40px;}
  #main .product .container .swiper-slide .name:after{ width:40px;  background-size:30px auto;}
  #main .product .container .button-prev{ left:-20px; width:40px; height:40px; margin-top:-20px;}
  #main .product .container .button-next{ right:-20px; width:40px; height:40px; margin-top:-20px;}
  #main .product .more>a{ font-size:14px;}

  #main .series .title>.tit{ font-size:30px;}
  #main .series .focus{ width:92%; padding:40px 0;}
  #main .series .focus .img{ width:292px; margin-left:-146px;}
  #main .series .focus .img .swiper-container{width:292px; height:60px;}
  #main .series .focus .img .swiper-slide{width:auto; height:51px;}

  #main .news{ width:92%;padding-top:60px;}
  #main .news .title>.tit{ font-size:30px;}
  #main .news .container{ padding:40px 0;}
  #main .news .container .swiper-pagination .swiper-pagination-bullet {width: 6px;height: 6px;}
  #main .news .container a>.img{ max-height:150px;}
  #main .news .container a>.text{ height:auto; padding:10px 20px;}
  #main .news .container a>.text .name{ font-size:16px; height:40px; line-height:20px; display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 2;overflow: hidden; margin:10px auto; padding:0;}
  #main .news .container a>.text .txt{ height:40px; font-size:14px; color:#999; line-height:20px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2;overflow: hidden;}

  #main .network{width:92%;}
  #main .network .title>.tit{ font-size:30px;}
  #main .network .container{ padding-bottom:50px;}
  #main .network .container .footprint{ position:relative; left:0; width:100%; height:auto; margin-left:0 !important;}
  #main .network .container .footprint>a{ float:left; width:49%; height:auto; margin-bottom:2px;}
  #main .network .container .item { display:none;}
  #main .network .container .map{ display:none;}

}


.ssp{margin:0 5px !important;}

@media only screen and (max-width: 780px){
  #main .catalog .swiper-slide a .img>img{width:50%;}
  /*#main .solutions{display:none;}*/
  #main .solutions .container .button-prev {
    left: -10px;top: 65%;
  }
  #main .solutions .container .button-next {
    right: -10px;top: 65%;
    }
    .ssp {
    margin: 0 8px !important;
}
}


@media only screen and (max-width: 680px){
  #main .solutions .title>.tit{ font-size:24px;}
  #main .solutions .title>.txt{ display:none;}
  #main .solutions .container a>.con>.name{ font-size:16px;}
  #main .solutions .container a>.con>.text{ display:none;}
  #main .product{ padding:40px 0;}
  #main .product .title>.tit{ font-size:24px;}
  #main .product .title>.txt{ display:none;}
  #main .series{ padding:40px 0;}
  #main .series .title>.tit{ font-size:24px;}
  #main .series .title>.txt{ display:none;}
  #main .series .focus .img{ position:relative; left:0; bottom:auto; width:60%; margin:0 auto; padding:10px 0;}
  #main .series .focus .img .swiper-container{width:100%; height:50px; margin:0 auto;}
  #main .series .focus .img .swiper-slide{ height:40px;}
  #main .series .focus .img .arrow-left{ left:-30px; margin-top:-15px; width:20px; height:20px; background-size:10px auto;}
  #main .series .focus .img .arrow-right{ right:-30px; margin-top:-15px; width:20px; height:20px; background-size:10px auto;}

  #main .news{ padding-top:40px;}
  #main .news .title>.tit{ font-size:24px;}
  #main .news .title>.txt{ display:none;}
  #main .network .title>.tit{ font-size:24px;}
  #main .network .title>.txt{ display:none;}
  #main .network .container .footprint>a>.name{ font-size:18px;}
  #main .solutions .container a>.con>.text{ line-height:20px; padding:0;}

}


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

  #main .solutions .container a>.con>.more{ display:none;}
  #main .product{ padding:30px 0;}
  #main .product .container .button-prev{ left:-16px; width:30px; height:30px; margin-top:-15px;}
  #main .product .container .button-next{ right:-16px; width:30px; height:30px; margin-top:-15px;}
  #main .series{ padding:30px 0;}
  #main .series .focus .img .swiper-container{width:100%; height:60px; margin:0 auto;}
  #main .series .focus .img .swiper-slide{ height:54px;}
  #main .news{ padding-top:30px;}
  #main .news .container .swiper-pagination{ padding:20px 0;}
  #main .network{padding-top:30px;}
  #main .network .container .footprint>a>.name{ font-size:16px;}

}








@keyframes scaled-rect {
  0%, to {
    transform:translateZ(0) scale(1.2) rotate(0);
    -moz-transform:translateZ(0) scale(1.2) rotate(.02deg)
  }
  50% {
    transform:translateZ(0) scale(.8) rotate(0);
    -moz-transform:translateZ(0) scale(.8) rotate(.02deg)
  }
}
@keyframes out-circle {
  0% {
    transform:scale(0);
    -moz-transform:scale(0) rotate(.02deg);
    opacity:1
  }
  70% {
    opacity:1
  }
  to {
    transform:scale(1);
    -moz-transform:scale(1) rotate(.02deg);
    opacity:0
  }
}


/*END*/



#navpart{overflow: hidden; position:relative; z-index:99; margin:0 auto; margin-top:-60px; background:rgba(0,0,0,.7); border-top:1px solid rgba(255,255,255,.3); width:100%; height:60px;}
#navpart>.btn{ display:none;}
#navpart>.container{ width:92%; max-width:1260px; margin:0 auto;}
#navpart>.container a{ display:block; float:left; width:auto; height:60px; line-height:60px; color:#fff; border-left:1px solid rgba(255,255,255,.3); text-align:center; font-size:16px; transition:all .35s;}
#navpart>.container a:last-of-type{ border-right:1px solid rgba(255,255,255,.3);}
#navpart>.container a:hover{ background:rgba(255,255,255,.2); color:#fff;}
#navpart>.container .w5>a{ width:19.8%;}
#navpart>.container .w4>a{ width:24.8%;}
#navpart>.container .A{ background:#fff!important; color:#d82128 !important; box-shadow:inset -2px 0 1px rgba(0,0,0,.1);}

#search{ position:relative; z-index:99; margin:0 auto; margin-top:-60px; background:rgba(0,0,0,.3); border-top:1px solid rgba(255,255,255,.2); width:100%; height:60px;}
#search>.wrap{ position:relative; width:600px; height:60px; margin:0 auto;}
#search>.wrap>form{ position:absolute; left:0; top:50%; width:100%; height:36px; margin-top:-18px; background:rgba(255,255,255,1);}
#search>.wrap>form input[type="text"]{outline: medium;float:left;height:36px;line-height:36px;width:86%; padding:0 2%; border:none; font-family:"Arial"; font-size:14px; background:none;box-sizing:border-box;overflow:hidden;}
#search>.wrap>form input::-webkit-input-placeholder{ color:#ccc;}
#search>.wrap>form button{  float:right;width:36px;height:36px;border:none; opacity:.8;background:url(../images/icon-search-black.png) no-repeat center center;background-size:auto 18px;cursor:pointer;box-sizing:border-box;overflow:hidden;}

#path{ width:92%; max-width:1260px; margin:0 auto; padding-top:20px; font-size:14px; color:#999; text-align:right;}
#path>a{ display:inline-block; color:#999; font-size:13px; transition:all .35s;}
#path>a>img{height:21px; width:auto; margin-right:6px;}
#path>a:hover{ text-decoration:underline;}

#title{ width:92%; max-width:1260px; margin:0 auto; text-align:left;}
#title>h2{ position:relative; padding-bottom:20px; font-size:32px; color:#333; text-transform:uppercase;}
#title>h2:after{ position:absolute; left:0; bottom:0; width:8%; height:2px; background:#d82128; content:'';}


@media only screen and (max-width: 960px){
  #path{ padding-top:10px; font-size:12px;}
  #path>a{ font-size:12px;}
  #path>a>img{height:18px;}
  #navpart{margin-top:0 !important;}
  #search>.wrap{ width:80%; height:60px;}
  #title{ margin-bottom:20px;}
  #title>h2{ padding:10px 0; font-size:24px;}
}

@media only screen and (max-width: 680px){
  #navpart{ position:relative; top:0; border-top:0 !important; height:auto;}
  #navpart>.btn{ position:relative; display:block; background:transparent url("../images/tag-title-bg.png") repeat-x; background-position:left bottom; line-height:40px; font-size:14px; padding:0 15px; cursor:pointer; color:#888; transition:all .35s;}
  #navpart>.btn:after{ position:absolute; z-index:4; right:20px; top:50%; margin-top:-3px; width: 0;height: 0; border-width: 6px; border-style: solid;border-color: #999 transparent transparent transparent; content:''; transition:all .35s;}
  #navpart>.A:after{transform:rotate(180deg);margin-top:-8px;}
  #navpart>.container{ display:none; position:relative; width:100%; background:#f3f3f3; box-shadow:0 2px 5px rgba(0,0,0,.1);}
  #navpart>.container a{ float:none!important; width:90% !important; height:40px; line-height:40px; border-bottom:1px solid #ddd; padding:0 5%; color:#666; border-left:0!important; text-align:left; font-size:14px; transition:all .35s;}
  #navpart>.container a:last-of-type{ border-right:0!important;}
  #navpart>.container a:hover{ background:transparent; color:#666;}
  #navpart>.container .w4>a{ width:auto;}
  #navpart>.container .A{ background:#d82128!important; color:#fff !important; box-shadow: none;}

  #path{ display:none;}
  #search{ margin-top:0 !important; height:40px;}
  #search>.wrap{ height:40px;}
  #search>.wrap>form{ height:22px; margin-top:-11px;}
  #search>.wrap>form input[type="text"]{height:22px;line-height:22px; font-size:12px;}
  #search>.wrap>form button{width:22px;height:22px;background-size:auto 14px;}
}

/*about TOP*/

#about{ width:92%; max-width:1260px; margin:0 auto; padding:50px 0 100px 0;}
#about>.container{ margin:0 auto;}
#about>.container>.profile{ width:60%; max-width:700px; margin:0 auto; text-align:left;}
#about>.container>.honor{ margin:0 auto;}
#about>.container>.honor>.item{ position:relative; width:25%; background:#f5f5f5; height:150px; padding:20px 0; float:left; text-align:center; transition:all .35s;}
#about>.container>.honor>.item:after{ position:absolute; z-index:3; top:50%; right:0; width:1px; height:100px; margin-top:-50px; background:#ddd; content:'';}
#about>.container>.honor>.item:nth-child(4):after{background:none!important;}
#about>.container>.honor>.item>h3{ position:relative; display:block; padding-top:20px; font-family:"Arial Narrow"; font-weight:bold; color:#d82128; font-size:60px;}
#about>.container>.honor>.item>h3 img{ width:auto;height:80px; margin-bottom:10px;}
#about>.container>.honor>.item>h3:after{ position:absolute; z-index:2; left:50%;bottom:-5px; width:30px; height:2px; background:#d82128; margin-left:-15px; content:''; transition:all .35s;}
#about>.container>.honor>.item>span{ display:block; padding:20px; font-size:12px; color:#999;}
#about>.container>.honor>.item:hover{background:#fff; z-index:99; transform:scale(1.1);box-shadow:0 0 10px rgba(0,0,0,.2); }
#about>.container>.honor>.item:hover:after{ background:none!important;}
#about>.container>.honor>.item:hover h3:after{ width:20px; margin-left:-10px;}
#about>.container>.video{ position:relative; width:35%; max-width:500px; margin:0 auto; overflow:hidden;}
#about>.container>.video>a{ display:block; position:relative;}
#about>.container>.video>a:after{ position:absolute; z-index:4; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.7) url("../images/icon-video.png") no-repeat; background-position:50% 50%; content:''; transition:all .35s;}
#about>.container>.video img{ max-width:100%; height:auto; transition:all .35s;}
#about>.container>.video>a:hover:after{ background-size:60px auto;}
#about>.container>.text{ font-size:16px; line-height:25px; color:#666; text-align:left;}
#about>.container>.text>p{ position:relative; margin-bottom:20px;}
#about>.container>.text>p.t500{ padding-left:30px; margin-bottom:10px; font-weight:700;}
#about>.container>.text>p.t500:after{ position:absolute; left:0; top:10px; width:20px; height:3px; background:#d82128; content:'';}
#about>.container>.text>h3{ color:#d82128; font-size:20px; margin-bottom:10px;}

@media only screen and (max-width: 960px){
  #about{ padding-bottom:100px;}
  #about>.container>.honor>.item{ width:50%;}
  #about>.container>.honor>.item:nth-child(2):after,#about>.container>.honor>.item:nth-child(2):before{background:none!important;}
  #about>.container>.honor>.item:nth-child(1):before{background:none!important;}
  #about>.container>.honor>.item:before{ position:absolute; z-index:3; left:50%; width:70%; height:1px; margin-left:-35%; background:#ddd; content:'';}
}

@media only screen and (max-width: 420px){
  #about{ padding-bottom:50px;}
  #about>.container{ padding:0;}
  #about>.container>.honor>.item>h3 img{ height:60px;}
  #about>.container>.profile{ float:none!important; width:100%; max-width:inherit;}
  #about>.container>.video{ float:none!important; width:100%; max-width:500px;}
  #about>.container>.text{ font-size:14px; line-height:20px;}
}


/*END*/


/*culture TOP*/

#culture{ width:92%; max-width:1260px; margin:0 auto; padding-bottom:100px;}
#culture>.content{ width:100%; padding:50px 0; margin:0px auto;}
#culture>.content .img{ width:35%; text-align:left; transition:all .35s;}
#culture>.content .img>img{ width:100%; height:auto;}
#culture>.content .text{ width:55%; padding:0 5%; text-align:left; transition:all .35s;}
#culture>.content .text>p{ padding:3px 0; color:#666; font-size:16px; line-height:30px;}
#culture>.content .text>p>strong{ color:#333;}
#culture>.tags{ margin:0 auto;}
#culture>.tags .tag-tit{ margin:0 auto; text-align:left;}
#culture>.tags .tag-tit>ul{ position:relative;}
#culture>.tags .tag-tit>ul:after{ position:absolute; z-index:1; left:0; bottom:0; width:100%; height:4px; background:#eee; content:'';}
#culture>.tags .tag-tit li{float:left; height:50px; line-height:50px; margin:0; position:relative; transition:all .35s;}
#culture>.tags .tag-tit li>a{ display:block; padding:0 20px; color:#333; font-size:16px; font-weight:bold; position:relative; transition:all .35s;}
#culture>.tags .tag-tit li>a:after{position:absolute; z-index:3; content:''; width:100%; height:4px; opacity:0; background:#d82128; left:0; bottom:0; transition:all .34s}
#culture>.tags .tag-tit li>a:hover{color:#d82128;}
#culture>.tags .tag-tit li>a.A{color:#d82128;}
#culture>.tags .tag-tit li>a.A:after{ opacity:1;}
#culture>.tags .tag-con div,#culture>.tags .tag-con p{margin:20px 0; line-height:160%;}
#culture>.tags .tag-con>.tit{ display:none;}
#culture>.tags .tag-con .con{padding:30px 5px; text-align:left; color:#666; font-size:16px; line-height:30px; display:none;}
#culture>.tags .tag-con .con img{max-width:100%; height:auto;}


@media only screen and (max-width: 960px){
  #culture{ padding-bottom:100px;}
  #culture>.content{ padding-bottom:10px;}
  #culture>.content .img{ float:none!important; width:100%; }
  #culture>.content .text{ float:none!important; width:100%; padding:5% 0 !important; float:none!important;}
  #culture>.tags .tag-tit{ display:none;}
  #culture>.tags .tag-con>.tit{ display:block; position:relative; padding:15px 0; font-size:16px; font-weight:bold; color:#333;}
  #culture>.tags .tag-con>.tit:after{ position:absolute; z-index:1; left:0; bottom:0; width:60px; height:2px; background:#d82128; content:'';}
  #culture>.tags .tag-con .con{ display:block!important;padding:10px 0 30px 0;}

}
@media only screen and (max-width: 420px){
  #culture{ padding-bottom:50px;}
  #culture>.content .text>p{ font-size:14px; line-height:20px;}
  #culture>.content .text>p>strong{ display:block;}
  #culture>.tags .tag-con>.tit{ padding:10px 0; font-size:14px;}
  #culture>.tags .tag-con .con{ font-size:14px; line-height:20px;}
}
/*END*/





/*history TOP*/

#history{ width:92%; max-width:1260px; margin:0 auto; padding-bottom:100px;}
#history>.timeaxis{ position:relative; padding:50px 0; margin:0 auto;}
#history>.timeaxis:after{position:absolute; z-index:1; left:50%; top:50%; width:80%; height:1px; margin-left:-40%; background:#eee; content:'';}
#history>.timeaxis>.swiper-container{ position:relative; z-index:99; width:80%; margin:0 auto;}
#history>.timeaxis>.swiper-container .swiper-wrapper{padding-bottom:10px;}
#history>.timeaxis>.swiper-container .swiper-slide {position:relative;z-index:99; text-align: center;font-size: 20px;}
#history>.timeaxis>.swiper-container a{ position:relative; padding-bottom:60px; display:block; color:#909090; transition:all .35s;}
#history>.timeaxis>.swiper-container a:after{ position:absolute; z-index:2; display:block; left:50%; bottom:35px; margin-left:-6px; width:12px; height:12px; border-radius:100%; background:#bbb; content:''; transition:all .35s;}
#history>.timeaxis>.swiper-container a:hover{ color:#d82128;}
#history>.timeaxis>.swiper-container a:hover:after{ background:#d82128;}
#history>.timeaxis>.swiper-container a.A{ color:#d82128;}
#history>.timeaxis>.swiper-container a.A:after{ background:#d82128;}
#history>.timeaxis .button-prev{ position:absolute; z-index:9; left:0; top:50%; width:60px; height:60px; margin-top:-30px; opacity:.8; background:url("../images/arrow-l.png") no-repeat; background-position:50% 50%; background-size:40px auto; cursor:pointer; transition:all .35s;}
#history>.timeaxis .button-next{ position:absolute; z-index:9; right:0; top:50%; width:60px; height:60px; margin-top:-30px; opacity:.8; background:url("../images/arrow-r.png") no-repeat; background-position:50% 50%; background-size:40px auto; cursor:pointer; transition:all .35s;}
#history>.timeaxis .button-prev:hover, #history>.timeaxis .button-next:hover{ opacity:.3;}
#history>.timeaxis .swiper-button-disabled{ opacity:.1!important;}
#history>.container{ width:80%; margin:0 auto; padding:40px 0; text-align:left;}
#history>.container>div{ display:none;padding:30px 0; font-size:16px; line-height:25px; color:#666; text-align:left; transition:all .35s;}
#history>.container .year{ display:none; transition:all .35s;}
#history>.container .text img{ max-width:100%; height:auto;}
#history>.container .text>p{ margin-bottom:20px;}

@media only screen and (max-width: 960px){
  #history{padding-bottom:100px;}
  #history>.timeaxis{ display:none;}
  #history>.container{ position:relative; padding:20px 0; width:100%; height:auto;}
  #history>.container:after{position:absolute; z-index:1; left:0; top:0; width:1px; height:100%; background:#ddd; content:'';}
  #history>.container>div{ position:relative; display:block; padding:50px 0 50px 20px;}
  #history>.container .year{ display:block; position:absolute; z-index:9; left:0; top:0; padding:0 20px; color:#d82128; font-size:25px; transition:all .35s;}
  #history>.container .year:after{ position:absolute; z-index:1; left:-4px; top:50%; margin-top:-6px; width:12px; height:12px; border-radius:100%; background:#d82128; content:'';}
}
@media only screen and (max-width: 420px){
  #history{padding-bottom:50px;}
  #history>.container>div{ font-size:14px; line-height:20px;}
  #history>.container .year{ font-size:20px;}
  #history>.container .year:after{ margin-top:-5px; width:10px; height:10px;}
}

/*END*/


/*equipment TOP*/

#equipment{ width:92%; max-width:1260px; margin:0 auto; padding-bottom:100px;}
#equipment>.container{ width:100%; padding:50px 0; margin:0px auto;}
#equipment>.container>ul{ margin:0 auto;}
#equipment>.container li{position:relative;display:block; float:left; width:21.3%; overflow:hidden; padding:1%; margin-right:2%; margin-bottom:2%; border:1px solid #eee;text-align:center;}
#equipment>.container li:nth-child(4n){ margin-right:0 !important;}
#equipment>.container li>a>.img{ position:relative; margin:0 auto; overflow:hidden;}
#equipment>.container li>a>.img>img{ width:100%; height:auto; transition:all 1s;}
#equipment>.container li>a>.name{ padding:15px 10px; font-size:16px; text-align:center; overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#equipment>.container li>a:hover .img>img{transform:scale(1.1);}


@media only screen and (max-width: 960px){
  #equipment>.container{ padding:20px 0;}
  #equipment>.container li{width:45.6%; margin-bottom:3%;}
  #equipment>.container li:nth-child(2n){ margin-right:0 !important;}
  #equipment>.container li:nth-child(4n){ margin-right:2% !important;}
  #equipment>.container li>a>.name{ padding:10px;}

}
@media only screen and (max-width: 420px){
  #equipment>.container li{width:46%;}
  #equipment>.container li:nth-child(2n){float:right;}
  #equipment>.container li:nth-child(4n){ float:right; margin-right:0 !important;}
  #equipment>.container li>a>.name{ padding:6px; font-size:12px;}

}

/*END*/






/*news TOP*/

#news{ width:92%; max-width:1260px; margin:0 auto; padding-bottom:100px;}
#news>.settop{ position:relative; width:100%; padding:50px 0; margin:0px auto;}
#news>.settop>.time{ position:absolute; z-index:12; left:30px; top:80px; width:140px; color:#d82128;}
#news>.settop>.time>.day{ display:inline-block; position:absolute; z-index:1; left:0; top:0; font-size:42px; font-weight:bold;}
#news>.settop>.time>.month{ display:inline-block; position:absolute; z-index:1; left:55px; top:8px; font-size:20px;}
#news>.settop>.img{ position:relative; float:left; width:58%; text-align:left; transition:all .35s;}
#news>.settop>.img img{ width:100%; height:auto; transition:all .35s;}
#news>.settop>.content{ position:absolute; z-index:3; right:0; width:50%; padding:60px 0; margin-top:40px;min-height: 190px; background:rgba(216,33,40,.9); transition:all .36s;}
#news>.settop>.content>.tit{ padding:0 60px; margin:0 auto;}
#news>.settop>.content>.tit>a{ display:block; font-size:20px; color:#fff;}
#news>.settop>.content>.txt{ padding:0 60px; margin:30px auto; font-size:14px; height:60px; line-height:20px; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3; overflow: hidden; color:#fff;}
#news>.settop>.content>.more{ padding:0 60px; text-align:left; margin:0 auto;}
#news>.settop>.content>.more>a{ display:inline-block; width: 120px;height: 36px;line-height: 36px; background:rgba(255,255,255,1); color:#d82128; font-size:13px; font-weight:600; text-align:center; transition:all .35s;}
#news>.settop>.content>.more>a:hover{ background:rgba(255,255,255,.8);}
#news>.list{ margin:0 auto;}
#news>.list>ul{ margin:0 auto;}
#news>.list li{ display:block; padding:20px 0; text-align:left;}
#news>.list li>a>.img{ width:240px; height:135px; overflow:hidden;}
#news>.list li>a>.img img{ width:100%;height:auto; transition:all 1s;}
#news>.list li>a>.content{ width:78%; max-width:980px; text-align:left; padding-bottom:20px; border-bottom:1px solid #ddd; transition:all .35s;}
#news>.list li>a>.content>.time{padding:5px 0;font-size:14px; color:#999;}
#news>.list li>a>.content>.tit{ padding:20px 0; font-size:20px; color:#333; transition:all .35s;}
#news>.list li>a>.content>.txt{ font-size:14px; color:#999; height:60px; line-height:20px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2; overflow:hidden; transition:all .35s;}
#news>.list li>a:hover .tit{ color:#d82128;}
#news>.list li>a:hover .img img{transform:scale(1.2);}
#news>.view{ position:relative; width:100%; padding:50px 0; margin:0px auto;}
#news>.view>.tit{ padding:0 10%; text-align:center; font-size:25px; font-weight:700; line-height:30px; color:#333;}
#news>.view>.time{ border-bottom:1px solid #eee; padding:20px 0;font-size:14px; color:#999; text-align:center;}
#news>.view>.text{ padding:50px 0; font-size:16px; line-height:25px; color:#666; text-align:left; transition:all .35s;}
#news>.view>.text img{ max-width:100%; height:auto;}
#news>.view>.text>p{ margin-bottom:20px;}
#news>.view>.pageurl{ padding:50px 0;}
#news>.view>.pageurl>.share{ width:70%;}
#news>.view>.pageurl>.share>.tit{ padding:5px 15px; font-size:16px; font-weight:700;}
#news>.view>.pageurl>.share span{display:inline-block; width:42px; height:42px; transition:all .35s;}
#news>.view>.pageurl>.share .st_facebook_large .stLarge{ background-image: url("../images/icon-facebook-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#news>.view>.pageurl>.share .st_twitter_large .stLarge{ background-image: url("../images/icon-twitter-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#news>.view>.pageurl>.share .st_linkedin_large .stLarge{ background-image: url("../images/icon-linkedin-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#news>.view>.pageurl>.share .st_googleplus_large .stLarge{ background-image: url("../images/icon-google-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#news>.view>.pageurl>.share .st_email_large .stLarge{ background-image: url("../images/icon-email-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#news>.view>.pageurl>.share .st_print_large .stLarge{ background-image: url("../images/icon-print-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#news>.view>.pageurl>.share .st_facebook_large .stLarge:hover{opacity:1; background-image: url("../images/icon-facebook-black.png")!important; background-repeat:no-repeat;background-position:50% 50%; background-size:100% auto;}
#news>.view>.pageurl>.share .st_twitter_large .stLarge:hover{opacity:1;background-image: url("../images/icon-twitter-black.png")!important; background-repeat:no-repeat;background-position:50% 50%; background-size:100% auto;}
#news>.view>.pageurl>.share .st_linkedin_large .stLarge:hover{opacity:1;background-image: url("../images/icon-linkedin-black.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#news>.view>.pageurl>.share .st_googleplus_large .stLarge:hover{opacity:1;background-image: url("../images/icon-google-black.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#news>.view>.pageurl>.share .st_email_large .stLarge:hover{opacity:1;background-image: url("../images/icon-email-black.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#news>.view>.pageurl>.share .st_print_large .stLarge:hover{opacity:1;background-image: url("../images/icon-print-black.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#news>.view>.pageurl>.url{ width:30%; padding:20px 0; text-align:right;}
#news>.view>.pageurl>.url>a{ display:inline-block; padding:10px; margin-left:5px; border:1px solid #ddd;border-radius:100%;}
#news>.view>.pageurl>.url>a.gray{opacity:.5;}
#news>.view>.pageurl>.url>a img{ opacity:.8; width:28px; height:auto; transition:all .35s;}
#news>.view>.pageurl>.url>a:hover img{ opacity:.4;}


@media only screen and (max-width: 960px){
  #news{ padding-bottom:100px;}
  #news>.settop{ margin:20px auto; padding:0; overflow:hidden;}
  #news>.settop>.time{ top:30px;}
  #news>.settop>.time>.day{ font-size:25px;}
  #news>.settop>.time>.month{ left:32px; font-size:14px;}
  #news>.settop>.img{float:none!important; width:100%;}
  #news>.settop>.content{ position:relative; width:100%; padding:30px 0; margin-top:0;min-height: inherit;}
  #news>.settop>.content>.tit{ padding:0 30px;}
  #news>.settop>.content>.tit>a{ height:60px; font-size:18px; display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp:2;overflow: hidden;}
  #news>.settop>.content>.txt{ padding:0 30px; margin:0 auto;}
  #news>.settop>.content>.more{ padding:10px 30px;}
  #news>.settop>.content>.more>a{width: 100px;height: 30px;line-height: 30px; font-size:12px;}
  #news>.list li>a>.img{ width:220px; height:125px; overflow:hidden;}
  #news>.list li>a>.content{ width:78%; max-width:450px;}
  #news>.list li>a>.content>.tit{ padding:10px 0; font-size:18px;}
  #news>.list li>a>.content>.txt{ height:40px;}
  #news>.view{ padding:20px 0;}
  #news>.view>.tit{padding:0 5%; font-size:20px; line-height:25px;}
  #news>.view>.text{ padding:50px 0; font-size:16px; line-height:25px; color:#666; text-align:left; transition:all .35s;}
}
@media only screen and (max-width: 420px){
  #news{ padding-bottom:50px;}
  #news>.settop>.img{float:none!important; width:100%;}
  #news>.settop>.content{ position:relative; width:100%;}
  #news>.settop>.content>.tit>a{ height:35px; font-size:16px;}
  #news>.settop>.content>.txt{ display:none;}
  #news>.list li>a>.img{float:none!important; width:100%; height:inherit;}
  #news>.list li>a>.content{ float:none!important; width:100%; max-width:inherit;}
  #news>.view>.tit{ font-size:18px; line-height:22px;}
  #news>.view>.text{font-size:14px; line-height:20px;}
  #news>.view>.pageurl>.share{ width:100%; float:none !important;}
  #news>.view>.pageurl>.url{ width:100%; float:none!important; padding:20px 10px; text-align:left;}
  #news>.view>.pageurl>.url>a img{ width:20px;}

}

/*END*/







/*fairs TOP*/

#fairs{ width:92%; max-width:1260px; margin:0 auto; padding-bottom:100px;}
#fairs>.list{ position:relative; width:100%; padding:50px 0; margin:0px auto;}
#fairs>.list>ul{ margin:0 auto;}
#fairs>.list li{ display:block; float:left; width:31%; margin-right:3%; margin-bottom:3%; text-align:left;}
#fairs>.list li:nth-child(3n){ margin-right:0 !important;}
#fairs>.list li>.img{ width:100%; max-height:245px; height:245px; overflow:hidden;}
#fairs>.list li>.img img{ width:100%;height:auto; transition:all 1s;}
#fairs>.list li>.content{ width:90%; margin:0 auto; padding:20px 0; transition:all .35s;}
#fairs>.list li>.content>.time{ font-size:12px; color:#999;}
#fairs>.list li>.content>.tit{ padding:10px 0;}
#fairs>.list li>.content>.tit>a{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2; overflow: hidden; font-size:20px; color:#333;}
#fairs>.list li>.content>.other{ padding-top:15px; text-align:left; height:30px;}
#fairs>.list li>.content>.other>.more{ display:inline-block; float:left;line-height:30px; padding-right:15px; border-right:1px solid #ccc;}
#fairs>.list li>.content>.other>.more>a{position:relative;display:block; font-size:13px; color:#d82128; font-weight:700; transition:all .35s;}
#fairs>.list li>.content>.other>.more>a:after {content: "»";display: inline;font-family: Arial,Helvetica,sans-serif;font-size: 20px;font-weight: 700;margin-left: 9px;position: relative;top: 1px;}
#fairs>.list li>.content>.other>.share{ display:block; float:left; padding-left:10px; line-height:30px;position:relative;}
#fairs>.list li>.content>.other>.share>.link{ position:relative; display:block; float:left; cursor:pointer; opacity:.6; width:30px; height:30px;line-height:30px; background:url("../images/icon-share-black.png") no-repeat; background-position:50% 50%; background-size:82% auto; transition:all .35s;}
#fairs>.list li>.content>.other>.share>.link:hover{opacity:1;background:url("../images/icon-share-red.png") no-repeat; background-position:50% 50%; background-size:82% auto;}
#fairs>.list li>.content>.other>.share>.sharings{display:none; float:left; padding:2px 10px; line-height:30px;}
#fairs>.list li>.content>.other>.share>.sharings span{display:inline-block; margin:0 2px; width:24px; height:24px; transition:all .35s;}
#fairs>.list li>.content>.other>.share>.sharings .st_facebook_large .stLarge{ opacity:.6;border:1px solid #000; border-radius:100%; background-image: url("../images/icon-facebook-black.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.list li>.content>.other>.share>.sharings .st_twitter_large .stLarge{ opacity:.6;border:1px solid #000; border-radius:100%; background-image: url("../images/icon-twitter-black.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.list li>.content>.other>.share>.sharings .st_linkedin_large .stLarge{ opacity:.6;border:1px solid #000; border-radius:100%; background-image: url("../images/icon-linkedin-black.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.list li>.content>.other>.share>.sharings .st_facebook_large .stLarge:hover{opacity:1;border:1px solid #d82128; background-image: url("../images/icon-facebook-red.png")!important; background-repeat:no-repeat;background-position:50% 50%; background-size:100% auto;}
#fairs>.list li>.content>.other>.share>.sharings .st_twitter_large .stLarge:hover{opacity:1;border:1px solid #d82128;background-image: url("../images/icon-twitter-red.png")!important; background-repeat:no-repeat;background-position:50% 50%; background-size:100% auto;}
#fairs>.list li>.content>.other>.share>.sharings .st_linkedin_large .stLarge:hover{opacity:1;border:1px solid #d82128;background-image: url("../images/icon-linkedin-red.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#fairs>.list li:hover .tit>a{ color:#d82128;}
#fairs>.list li>.img:hover img{transform:scale(1.2);}
#fairs>.list li>.content>.other>.more>a:hover{ color:#999;}
#fairs>.view{ position:relative; width:100%; padding:50px 0; margin:0px auto;}
#fairs>.view>.tit{ padding:0 10%; text-align:center; font-size:25px; font-weight:700; line-height:30px; color:#333;}
#fairs>.view>.time{ border-bottom:1px solid #eee; padding:20px 0;font-size:14px; color:#999; text-align:center;}
#fairs>.view>.text{ padding:50px 0; font-size:16px; line-height:25px; color:#666; text-align:left; transition:all .35s;}
#fairs>.view>.text img{ max-width:100%; height:auto;}
#fairs>.view>.text>p{ margin-bottom:20px;}
#fairs>.view>.pageurl{ padding:50px 0;}
#fairs>.view>.pageurl>.share{ width:70%;}
#fairs>.view>.pageurl>.share>.tit{ padding:5px 15px; font-size:16px; font-weight:700;}
#fairs>.view>.pageurl>.share span{display:inline-block; width:42px; height:42px; transition:all .35s;}
#fairs>.view>.pageurl>.share .st_facebook_large .stLarge{ background-image: url("../images/icon-facebook-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.view>.pageurl>.share .st_twitter_large .stLarge{ background-image: url("../images/icon-twitter-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.view>.pageurl>.share .st_linkedin_large .stLarge{ background-image: url("../images/icon-linkedin-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.view>.pageurl>.share .st_googleplus_large .stLarge{ background-image: url("../images/icon-google-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.view>.pageurl>.share .st_email_large .stLarge{ background-image: url("../images/icon-email-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.view>.pageurl>.share .st_print_large .stLarge{ background-image: url("../images/icon-print-red.png")!important; background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; transition:all .35s;}
#fairs>.view>.pageurl>.share .st_facebook_large .stLarge:hover{opacity:1; background-image: url("../images/icon-facebook-black.png")!important; background-repeat:no-repeat;background-position:50% 50%; background-size:100% auto;}
#fairs>.view>.pageurl>.share .st_twitter_large .stLarge:hover{opacity:1;background-image: url("../images/icon-twitter-black.png")!important; background-repeat:no-repeat;background-position:50% 50%; background-size:100% auto;}
#fairs>.view>.pageurl>.share .st_linkedin_large .stLarge:hover{opacity:1;background-image: url("../images/icon-linkedin-black.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#fairs>.view>.pageurl>.share .st_googleplus_large .stLarge:hover{opacity:1;background-image: url("../images/icon-google-black.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#fairs>.view>.pageurl>.share .st_email_large .stLarge:hover{opacity:1;background-image: url("../images/icon-email-black.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#fairs>.view>.pageurl>.share .st_print_large .stLarge:hover{opacity:1;background-image: url("../images/icon-print-black.png")!important; background-repeat:no-repeat;;background-position:50% 50%; background-size:100% auto;}
#fairs>.view>.pageurl>.url{ width:30%; padding:20px 0; text-align:right;}
#fairs>.view>.pageurl>.url>a{ display:inline-block; padding:10px; margin-left:5px; border:1px solid #ddd;border-radius:100%;}
#fairs>.view>.pageurl>.url>a.gray{opacity:.5;}
#fairs>.view>.pageurl>.url>a img{ opacity:.8; width:28px; height:auto; transition:all .35s;}
#fairs>.view>.pageurl>.url>a:hover img{ opacity:.4;}


@media only screen and (max-width: 960px){
  #fairs{ padding-bottom:100px;}
  #fairs>.list{ padding:20px 0;}
  #fairs>.list li{ width:48.4%; margin-right:3%;}
  #fairs>.list li:nth-child(2n){ margin-right:0 !important;}
  #fairs>.list li:nth-child(3n){ margin-right:3% !important;}
  #fairs>.list li>.img{ max-height:225px;}
  #fairs>.list li>.content>.tit>a{font-size:18px;}
  #fairs>.list li>.content>.other>.more>a{font-size:12px;}
  #fairs>.list li>.content>.other>.share>.sharings{display:block;}
  #fairs>.view{ padding:20px 0;}
  #fairs>.view>.tit{padding:0 5%; font-size:20px; line-height:25px;}
  #fairs>.view>.text{ padding:50px 0; font-size:16px; line-height:25px; color:#666; text-align:left; transition:all .35s;}
}
@media only screen and (max-width: 420px){
  #fairs{ padding-bottom:50px;}
  #fairs>.list li{ float:none!important; width:100%; margin-right:0;}
  #fairs>.list li:nth-child(2n){ margin-right:0 !important;}
  #fairs>.list li:nth-child(3n){ margin-right:0 !important;}
  #fairs>.list li>.img{ max-height:inherit; height:auto;}
  #fairs>.list li>.content>.tit>a{font-size:18px;}
  #fairs>.list li>.content>.other>.more>a{font-size:12px;}
  #fairs>.view>.tit{ font-size:18px; line-height:22px;}
  #fairs>.view>.text{font-size:14px; line-height:20px;}
  #fairs>.view>.pageurl>.share{ width:100%; float:none !important;}
  #fairs>.view>.pageurl>.url{ width:100%; float:none!important; padding:20px 10px; text-align:left;}
  #fairs>.view>.pageurl>.url>a img{ width:20px;}
}

/*END*/











/*product TOP*/

#product{ width:100%; margin:0 auto; overflow:hidden;}
#product>.catalog{width:92%; max-width:1260px; padding-top:50px; margin:0 auto;}
/*
#product>.catalog>.item{ position:relative; display:block; width:49%; float:left; overflow:hidden; margin-right:2%; margin-bottom:2%;}
#product>.catalog>.item:after{ position:absolute; z-index:2; left:0; top:0; width:100%; height:0; background:rgba(216,33,40,.85); content:''; transition:all .35s;}
#product>.catalog>.item:nth-child(2n){ margin-right:0!important;}
#product>.catalog>.item>.type{ margin:0 auto; text-align:left;}
#product>.catalog>.item>.type>a{ display:block;}
#product>.catalog>.item>.type>a>img{ width:100%; height:auto;}
#product>.catalog>.item>.list{ position:absolute; z-index:99; left:50%; top:10%; width:80%; margin-left:-40%; text-align:left; opacity:0; transition:all .35s;}
#product>.catalog>.item>.list>a{ position:relative; display:block; float:left; width:40%; padding:8px 10% 8px 0; line-height:20px; font-size:15px; color:#fff; transition:all .35s;}
#product>.catalog>.item>.list>a:after{ position:absolute; left:-20px; top:18px; width:0; height:1px; opacity:0; background:#fff; content:''; transition:all .35s;}
#product>.catalog>.item>.list>a:hover{text-decoration:underline;}
#product>.catalog>.item>.list>a:hover:after{ width:14px; opacity:.8;}
#product>.catalog>.item:hover:after{ height:100%;}
#product>.catalog>.item:hover .list{ opacity:1;}
*/
#product>.catalog>.item{ position:relative; display:block; min-height:500px; background:#fff; margin-bottom:2%;}
#product>.catalog>.item>.type{ position:absolute; left:0; top:0; text-align:left; width:250px; height:100%; background:#0e1227; overflow:hidden;}
#product>.catalog>.item>.type img{ position:relative; z-index:9; left:0; width:100%; height:auto;}
#product>.catalog>.item>.type .tit{ position:absolute; z-index:99; left:30px; top:75px; font-size:16px; color:#fff; line-height:20px;}
#product>.catalog>.item>.type .tit:after{position:absolute; z-index:1; left:0; top:-16px; background:#d82128; width:10px; height:10px; content:'';}
#product>.catalog>.item>.type .more{ display:none;}
#product>.catalog>.item>.list{ width:75%; max-width:900px; padding:50px;}
#product>.catalog>.item>.list .swiper-container{ position:inherit;}
#product>.catalog>.item>.list .swiper-slide>a{ display:block; color:#d82128; height:80px; font-size:16px; font-weight:700;}
#product>.catalog>.item>.list .swiper-slide>a>img{ width:auto; height:80px; float:left; border:1px solid #ddd; margin-right:20px;}
#product>.catalog>.item>.list .swiper-slide>a>span{ display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden; padding-top:8px; width:50%; float:left; line-height:20px;}
#product>.catalog>.item>.list .swiper-slide>div{ position:relative; height:270px; display:block; padding:20px 0;}
#product>.catalog>.item>.list .swiper-slide>div:after{position:absolute; z-index:1; left:20px; top:0; width:1px; height:100%; background:#ddd; content:'';}
#product>.catalog>.item>.list .swiper-slide>div>a{ display:block; padding:6px 0 6px 50px; font-size:14px; line-height:16px;}
#product>.catalog>.item>.list .swiper-pagination{ bottom:20px; padding-left:100px; text-align:center; color:#999; font-size:14px;}
#product>.catalog>.item>.list .button-prev{ position:absolute; z-index:99; bottom:0; right:37px; width:36px; height:36px; border:1px solid #ddd; cursor:pointer; background:#f3f3f3 url("../images/arrow-l.png") no-repeat; background-position:50% 50%; background-size:20px auto; transition:all .35s;}
#product>.catalog>.item>.list .button-next{ position:absolute; z-index:99; bottom:0; right:0; width:36px; height:36px; border:1px solid #ddd; cursor:pointer; background:#f3f3f3 url("../images/arrow-r.png") no-repeat; background-position:50% 50%; background-size:20px auto; transition:all .35s;}
#product>.catalog>.item>.list .swiper-button-disabled{ opacity:.5;}


#product>.product{ width:92%; max-width:1260px; margin:0 auto;padding: 20px 0;}

/*
#product>.product>.prolist{ padding:0; text-align:left;}
#product>.product>.prolist>ul{ position:relative; padding:0; margin:0 auto; background:#fff;}
#product>.product>.prolist>ul:after{position:absolute; z-index:1; left:0; bottom:0; width:100%; height:1px; background:#fff; content:'';}
#product>.product>.prolist>ul>li{ position:relative; display:block; float:left; width:33.26%; border-right:1px solid #ddd; border-bottom:1px solid #ddd; height:90px; line-height:90px;}
#product>.product>.prolist>ul>li:nth-child(3n){ border-right:0!important;}
#product>.product>.prolist>ul>li:after{ position:absolute; z-index:4; right:20px; top:50%; margin-top:-3px; width: 0;height: 0; border-width: 6px; border-style: solid;border-color: #999 transparent transparent transparent; content:''; transition:all .35s;}
#product>.product>.prolist>ul>li>a{display:block; font-size:16px; font-weight:bold; padding:0 20px; line-height:90px;}
#product>.product>.prolist>ul>li.A{ background:#666;}
#product>.product>.prolist>ul>li.A:after{border-color: #fff transparent transparent transparent;}
#product>.product>.prolist>ul>li.A>a{ color:#fff;}
#product>.product>.prolist>ul>li>div{ display:none; position:absolute; z-index:99; left:0; top:90px; width:100%; height:auto; padding-bottom:20px; background:#666; overflow:hidden; transition:top .35s;}
#product>.product>.prolist>ul>li>div a{ position:relative; display:block; width:90%; margin:0 auto; background:#666; line-height:24px; padding:5px 0; font-size:16px;font-family:"Arial"; color:rgba(255,255,255,1); text-align:left; transition:all .35s;}
#product>.product>.prolist>ul>li>div a:hover{ color:#d82128;}

*/


#product>.product>.prolist{ padding-top:50px; text-align:left;}
#product>.product>.prolist>ul{ position:relative;z-index:9; padding:0; margin:0 auto;}
#product>.product>.prolist>ul:after{content:''; display:block; height:0; float:none; clear:both;}
#product>.product>.prolist>ul>li{ position:relative; display:block; float:left; width:33.26%; border-right:1px solid #ddd; border-bottom:1px solid #ddd; height:90px; line-height:90px; background:#fff;}
#product>.product>.prolist>ul>li:nth-child(3n){ border-right:0!important;}
#product>.product>.prolist>ul>li>a{display:block; font-size:15px; font-weight:600; padding:0 25px 0 20px;}
#product>.product>.prolist>ul>li:after{position:absolute; z-index:4; right:20px; top:50%; margin-top:-3px; width: 0;height: 0; border-width: 6px; border-style: solid;border-color: #999 transparent transparent transparent; content:''; transition:all .35s;}
#product>.product>.prolist>ul>li>span.open{ display:none;}
#product>.product>.prolist>ul>li>span.close{ display:none;}
#product>.product>.prolist>ul>li.A{ background:#666;}
#product>.product>.prolist>ul>li.A>a{ color:#fff;}
#product>.product>.prolist>ul>li ul{ display:none; position:relative; z-index:99; padding:10px 0 30px 0; background:#666;}
#product>.product>.prolist>ul>li ul>li{ position:relative; display:block; font-size:14px; line-height:20px;transition:all .35s;}
#product>.product>.prolist>ul>li ul>li>a{ position:relative; display:block; width:90%; margin:0 auto; background:#666; line-height:24px; padding:5px 5%; color:rgba(255,255,255,1); text-align:left; transition:all .35s;}
#product>.product>.prolist>ul>li ul>li>a:hover{ color:#d82128;}
#product>.product>.prolist>ul>li span.open{ position:absolute; z-index:9; right:30px; top:10px; width:16px; height:16px; cursor:pointer; background:url("../images/icon-plus.png") no-repeat; background-position:50% 50%; background-size:100% auto;}
#product>.product>.prolist>ul>li span.close{ position:absolute; z-index:9; right:30px; top:10px; width:16px; height:16px; cursor:pointer; background:url("../images/icon-minus.png") no-repeat; background-position:50% 50%; background-size:100% auto;}
#product>.product>.prolist>ul>li ul>li ul{ padding:5px 5px 20px 5px; font-size:14px; border-bottom:1px solid rgba(255,255,255,.1);}
#product>.product>.prolist>ul>li a{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}


#product>.product>.path{ font-size: 23px;color: #000;padding:15px 0 20px 0; text-align:left;}
#product>.product>.path>a{ display:inline-block; font-size:23px; color:#000;}
#product>.product>.path>a:last-child{ color:#d82128;}
#product>.product>.container{ margin:0 auto;}
#product>.product>.container>ul{ position:relative; padding:0; margin:0 auto; background:#fff;}
#product>.product>.container>ul>li{ position:relative; width:33.33%; float:left;}
#product>.product>.container>ul>li:after{ position:absolute; z-index:1; left:0; top:0; width:100%; height:100%; border-bottom:1px solid #eee; border-right:1px solid #eee; content:'';}
#product>.product>.container>ul>li:nth-child(3n):after{ border-right:0!important;}
#product>.product>.container>ul>li>a{ position:relative; z-index:8; display:block;}
#product>.product>.container>ul>li>a>.img{ width:72.5%;margin:35px auto 0;}
#product>.product>.container>ul>li>a>.img>img{ width:100%; height:auto;}
#product>.product>.container>ul>li>a>.name{width:86%;margin:0 auto 40px auto;line-height:50px;height:50px;font-size:23px;color:#666; overflow: hidden;text-overflow:ellipsis;white-space: nowrap;text-align:center;}
#product>.product>.container>ul>li>a:hover .name{ color:#d82128;}

#product>.view{ width:100%;padding-bottom: 100px; background:#edf1f5 url("../images/product-view-bt.jpg") repeat-x; background-position:0 0; margin:0 auto;}
#product>.view>.wrap{ position:relative; width:92%; max-width:1260px; padding:160px 0 0px 0; margin:0 auto;}
#product>.view>.title{width:92%; max-width:1260px; padding:30px 0 10px 0; margin:0 auto; font-size:24px; text-transform:uppercase; color:#333; text-align:left;}
#product>.view .content{ width:40%; padding:8% 0; text-align:left;}
#product>.view .content>.new{ padding-bottom:20px; text-align:left;}
#product>.view .content>.new>span{ display:inline-block; padding:5px 20px; background:#d82128; font-size:16px; color:#fff;}
#product>.view .content>.tit{ font-size:48px; font-weight:bold; color:#d82128;}
#product>.view .content>.subtit{ font-size:30px; font-weight:bold; color:#000; line-height:130%;}
#product>.view .content>.label{ width:80%; padding:20px 0; font-size:14px; line-height:20px; color:#999;}
#product>.view .content>.label>.lab-tit{ width:70px; height:auto; float:left; color:#666;}
#product>.view .content>.label>.lab-tit>img{ height:21px; width:auto; margin-right:5px; opacity:.5;}
#product>.view .content>.label>.lab-txt{ width:78%; float:left;color:#999;}
#product>.view .content>.label>.lab-txt>a{ display:block; float:left; margin-left:8px; color:#999; transition:all .35s;}
#product>.view .content>.label>.lab-txt>a:hover{ color:#d82128; text-decoration:underline;}
#product>.view .content>.btn{ padding:50px 0;}
#product>.view .content>.btn>a{ position:relative; overflow:hidden; display:inline-block; height:50px; line-height:50px; padding:0 36px; font-size:18px; text-align:center; color:#fff; border-radius:3px; background:#ff9900; margin-right:12px; transition:all .35s;}
#product>.view .content>.btn>a:after{ position:absolute; z-index:1; left:0; top:0; width:0; height:100%; background:rgba(255,255,255,.1); content:''; transition:all .35s;}
#product>.view .content>.btn>a>img{ height:32px; width:auto; margin-right:6px;}
#product>.view .content>.btn>a.back{ background:#999;}
#product>.view .content>.btn>a.back>img{ display:none;}
#product>.view .content>.btn>a:hover:after{ width:100%;}
#product>.view .focus{ width:500px; height:500px;}
#product>.view .focus .bimg{ position:relative; width:100%; height:500px;}
#product>.view .focus .bimg .swiper-wrapper:hover{z-index:11; position:relative;}
#product>.view .focus .bimg .swiper-slide>img{max-width:100%; max-height:100%;}
#product>.view .focus .bimg .swiper-container{width:100%; height:100%;}
#product>.view .focus .bimg .arrow-left{ position:absolute; z-index:99; left:0; top:50%; margin-top:-15px; width:30px; height:30px; background:rgba(0,0,0,.2) url("../images/arrow-l-white.png") no-repeat; background-position:50% 50%; background-size:14px auto; border-radius:100%; cursor:pointer; transition:all .35s;}
#product>.view .focus .bimg .arrow-right{ position:absolute; z-index:99; right:0; top:50%; margin-top:-15px; width:30px; height:30px; background:rgba(0,0,0,.2) url("../images/arrow-r-white.png") no-repeat; background-position:50% 50%; background-size:14px auto; border-radius:100%; cursor:pointer; transition:all .35s;}
#product>.view .focus .bimg .arrow-left:hover, #product>.view .focus .bimg .arrow-right:hover{ background-color:rgba(0,0,0,.4);}
#product>.view .focus .img{width:100%; margin-top:10px;}
#product>.view .focus .img .swiper-container{width:321px; height:80px; margin:auto; text-align:center;}
#product>.view .focus .img .swiper-slide{width:71px; height:71px;}
#product>.view .focus .img img{padding:1px; width:100%; height:100%; display:block; border:1px solid transparent; box-sizing:border-box;}
#product>.view .focus .img .active-nav img{padding:0; border:1px solid #d82128 !important;}
#product>.view .focus .img .active-nav{position:relative; z-index:11;}
#product>.view>.tags{width:92%; max-width:1260px; margin:0 auto; background:#fff;border-radius:3px; overflow:hidden; box-shadow:0 2px 3px rgba(0,0,0,.1); padding:0!important;}
#product>.view .tag-tit{margin:0 auto; border-radius:3px 3px 0 0; background:#afafaf;}
#product>.view .tag-tit li{float:left; height:50px; line-height:50px; margin:0; position:relative;}
#product>.view .tag-tit li>a{ display:block; padding:0 20px; color:#333; font-size:18px; position:relative;}
#product>.view .tag-tit li>a:after{position:absolute; content:''; width:100%; height:0; background:#d82128; left:0; bottom:-15px;}
#product>.view .tag-tit li>a:hover{color:#d82128;}
#product>.view .tag-tit li>a.A{color:#fff; background:#d82128;}
#product>.view .tag-tit li>a.A:after{height:0;}
#product>.view .tag-con{font-size:15px; margin:0 auto; color:#666; text-align:left;}
#product>.view .tag-con div,#product>.view .tag-con p{margin:20px 0; line-height:160%;}
#product>.view .tag-con>.tit{ display:none;}
#product>.view .tag-con .con{padding:0 50px; text-align:left; font-size:16px; line-height:30px; display:none;}
#product>.view .tag-con .con img{max-width:100%; height:auto;}
#product>.view .tag-con .con .pdf{ display:block; padding:5px 0; font-size:16px;}
#product>.view .tag-con .con .pdf>img{ height:60px; width:auto;}
#product>.view .tag-con .con .cer{ display:block; padding:5px 0; font-size:16px;}
#product>.view .tag-con .con .cer>img{ height:60px; width:auto;}
#product>.view .tag-con table{width:100%; border-left:1px solid #ddd; border-top:1px solid #ddd; border-collapse:collapse;}
#product>.view .tag-con table td{border-right:1px solid #ddd; border-bottom:1px solid #ddd; font-size:16px; padding:5px; transition:all .25s;}
#product>.view .tag-con table td p,#product .view>.tag-con table td div{margin:0;}
#product>.view .tag-con table td:hover{background:#eee;}
#product>.view .tag-con ol.list-paddingleft-2{padding-left:15px;}
#product>.view .tag-con ol.list-paddingleft-2>li{list-style-type:decimal; padding-left:5px;}
#product>.view .tag-con li>p{display:block; margin:0;}
#product>.view>.inquiry{width:92%; max-width:1260px; margin:0 auto; background:#fff;border-radius:3px; overflow:hidden; box-shadow:0 2px 3px rgba(0,0,0,.1); padding:0!important;}
#product>.view>.inquiry>form>div{padding:20px 40px; text-align:left;}
#product>.view>.inquiry>form>div:first-child{padding-top:40px;}
#product>.view>.inquiry>form>div:last-child{padding-bottom:40px;}
#product>.view>.inquiry>form input,#product>.view>.inquiry>form textarea{padding:8px; border:1px solid #e6e6e6; box-sizing:border-box; transition:all .2s; font-family:Arial; font-size:14px;}
#product>.view>.inquiry>form textarea{color:#3d4db2; border:1px solid #e6e6e6;}
#product>.view>.inquiry>form .form-tit{padding-bottom:6px; font-size:14px;}
#product>.view>.inquiry>form input:focus,form.form textarea:focus{border:1px solid #ccc;}
#product>.view>.inquiry>form .submit{display:inline-block; padding:0 30px; line-height:35px; height:35px; color:#fff; background:#d82128; border-radius:3px; transition:all .25s; font-size:16px;}
#product>.view>.inquiry>form .submit:hover{background:#666;}
#product>.view>.related{ position:relative; width:92%; max-width:1260px; margin:0 auto;}
#product>.view>.related .swiper-slide{background:#fff;border-radius:3px; overflow:hidden; box-shadow:0 2px 3px rgba(0,0,0,.1); }
#product>.view>.related .img{ margin:0 auto; text-align:center;}
#product>.view>.related .img>img{ width:100%; height:auto;}
#product>.view>.related .name{ background:#fff; padding:20px; font-size:14px; color:#666; text-align:center; line-height:20px; overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
#product>.view>.related .button-next{ position:absolute; z-index:9; top:-50px; right:0; width:28px; height:28px; cursor:pointer; border:1px solid #666; border-radius:100%; background: url("../images/arrow-r.png") no-repeat; background-position:50% 50%; background-size:14px auto; opacity:.3; transition:all .35s;}
#product>.view>.related .button-prev{ position:absolute; z-index:9; top:-50px; right:36px; width:28px; height:28px; cursor:pointer; border:1px solid #666; border-radius:100%; background: url("../images/arrow-l.png") no-repeat; background-position:50% 50%; background-size:14px auto; opacity:.3; transition:all .35s;}
#product>.view>.related .button-next:hover, #product>.view>.related .button-prev:hover{ border:1px solid #ccc; background-color:#fff; opacity:.8;}
#product>.view>.related a:hover .name{color:#d82128;}

#product>.search{position:relative; width:92%; max-width:1260px; padding:200px 0 100px 0; margin:0 auto;}
#product>.search>.sear{position:relative; height:60px; margin:0 auto;}
#product>.search>.sear>form{width:500px; height:36px; background:rgba(255,255,255,1);}
#product>.search>.sear>form input[type="text"]{outline: medium;float:left;height:36px;line-height:36px;width:86%; padding:0 2%; border:none; font-family:"Arial"; font-size:14px; background:none;box-sizing:border-box;overflow:hidden;}
#product>.search>.sear>form input::-webkit-input-placeholder{ color:#ccc;}
#product>.search>.sear>form button{ float:right;width:36px;height:36px;border:none; opacity:.8;background:url(../images/icon-search-black.png) no-repeat center center;background-size:auto 18px;cursor:pointer;box-sizing:border-box;overflow:hidden;}
#product>.search>.keyword{ font-size: 23px;color: #000;margin: 0px 0 20px;height: 56px;line-height: 56px; text-align:left;}
#product>.search>.keyword>a{ display:inline-block; color:#000;}
#product>.search>.keyword>a.A{ color:#d82128;}
#product>.search>.container{ margin:0 auto;}
#product>.search>.container>ul{ position:relative; padding:0; margin:0 auto; background:#fff;}
#product>.search>.container>ul>li{ position:relative; width:20%; float:left;}
#product>.search>.container>ul>li:after{ position:absolute; z-index:1; left:0; top:0; width:100%; height:100%; border-bottom:1px solid #eee; border-right:1px solid #eee; content:'';}
#product>.search>.container>ul>li:nth-child(5n):after{ border-right:0!important;}
#product>.search>.container>ul>li>a{ position:relative; z-index:8; display:block;}
#product>.search>.container>ul>li>a>.img{ width:72.5%;margin:35px auto 0;}
#product>.search>.container>ul>li>a>.img>img{ width:100%; height:auto;}
#product>.search>.container>ul>li>a>.name{width:86%;margin:0 auto 20px auto;line-height:20px;height:40px;font-size:14px; color:#666; text-align:center;display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp:2;overflow: hidden;}
#product>.search>.container>ul>li>a:hover .name{ color:#d82128;}





@media only screen and (max-width: 1460px){
  #product>.catalog>.item>.list{ width:70%;}
}

@media only screen and (max-width: 1280px){
  #product>.catalog>.item>.list{ width:65%;}
  #product>.catalog>.item>.list .swiper-slide>a{ height:70px;}
  #product>.catalog>.item>.list .swiper-slide>a>img{ height:70px; margin-right:15px;}
  #product>.view>.wrap{ max-width:1000px;}
  #product>.view>.title{ max-width:1000px;}
  #product>.view>.tags{max-width:1000px;}
  #product>.view>.inquiry{max-width:1000px;}
  #product>.view>.related{ max-width:1000px;}
  #product>.search{max-width:1000px;}
}

@media only screen and (max-width: 1120px){
  #product>.catalog{padding-top:0px;}
  #product>.catalog>.item>.list{ width:60%;}
}

@media only screen and (max-width: 960px){
  #product{ padding:20px 0 100px 0;}
  /*#product>.catalog>.item>.list{ display:none;}
  #product>.catalog>.item:after{ display:none;}*/
  #product>.catalog>.item>.list{ width:58%;}
  /*#product>.product>.prolist>ul>li{ width:49.9%;}
  #product>.product>.prolist>ul>li:nth-child(3n){ border-right:1px solid #ddd!important;}
  #product>.product>.prolist>ul>li:nth-child(2n){ border-right:0!important;}*/
  #product>.product>.prolist{ padding-top:0;}
  #product>.product>.prolist>ul>li{ width:49.9%;}
  #product>.product>.prolist>ul>li:nth-child(3n){ border-right:1px solid #ddd!important;}
  #product>.product>.prolist>ul>li:nth-child(2n){ border-right:0!important;}
  #product>.product>.prolist>ul>li>a{font-size:14px;}
  #product>.product>.prolist>ul>li ul>li{ font-size:12px; line-height:18px;}
  #product>.product>.prolist>ul>li ul>li>a{ line-height:18px;}
  #product>.product>.prolist>ul>li ul>li ul{ font-size:12px;}
  #product>.product>.path{ font-size: 18px;}
  #product>.product>.path>a{ font-size:18px;}
  #product>.product>.container>ul>li>a>.name{font-size:16px; margin:0 auto 10px auto;}
  #product>.view>.wrap{ width:100%; padding:50px 0 100px 0!important;}
  #product>.view .content{ width:100%; float:none!important;}
  #product>.view .content>.new{ position:absolute; z-index:9; right:0; top:20px; width:80px; height:80px; background:url("../images/new-bg.png") no-repeat; background-position:0 0; background-size:100% 100%; padding-bottom:0px; text-align:left;}
  #product>.view .content>.new>span{ display:inline-block; padding:15px 0 0 38px; background:transparent; font-size:14px; color:#fff;}
  #product>.view .content>.tit{ font-size:40px; text-align:center;}
  #product>.view .content>.subtit{ font-size:25px; text-align:center;}
  #product>.view .content>.label{ display:none; width:100%;}
  #product>.view .content>.btn{ position:absolute; z-index:2; left:20px; top:60px; padding:0;}
  #product>.view .content>.btn>a{ height:36px; line-height:36px; padding:0 20px; font-size:14px;}
  #product>.view .content>.btn>a>img{ height:24px;}
  #product>.view .content>.btn>a.inquiry{ display:none;}
  #product>.view .content>.btn>a.back>img{ display:inline-block;}
  #product>.view .focus{ float:none!important; margin:0 auto;}
  #product>.view>.title{padding:30px 0; font-size:20px;}
  #product>.view .tag-tit{ display:none;}
  #product>.view .tag-con div,#product>.view .tag-con p{ margin:0 !important;}
  #product>.view .tag-con>.tit{ position:relative; display:block; border-top:1px solid #eee; padding:0 20px; height:50px; line-height:50px; background:url("../images/tag-title-bg.png") repeat-x; background-position:left bottom;}
  #product>.view .tag-con>.tit:after{ position:absolute; z-index:3; top:50%; margin-top:-10px; right:20px; width:20px; height:20px; background:url("../images/arrow-up-circular-gray.png") no-repeat; background-size:100% auto; background-position:50% 50%; content:''; transition:all .35s;}
  #product>.view .tag-con>.A{ background:none; color:#d82128; font-weight:bold;}
  #product>.view .tag-con>.A:after{transform:rotate(180deg);}
  #product>.view .tag-con .con{padding:20px;font-size:14px; line-height:24px;}
  #product>.view .tag-con table td{font-size:14px;}
  #product>.view .tag-con .con .pdf{ font-size:14px;}
  #product>.view .tag-con .con .pdf>img{ height:36px;}
  #product>.view .tag-con .con .cer{ font-size:14px;}
  #product>.view .tag-con .con .cer>img{ height:36px;}
  #product>.view>.inquiry>form>div{padding:20px!important;}
  #product>.search{padding:80px 0 100px 0;}
  #product>.search>.keyword{ font-size:18px;}
  #product>.search>.container>ul>li{ width:25%;}
  #product>.search>.container>ul>li:nth-child(4n):after{ border-right:0!important;}
  #product>.search>.container>ul>li:nth-child(5n):after{ border-right:1px solid #eee!important;}
  #product>.search>.container>ul>li>a>.name{height:38px;font-size:14px;}


}
@media only screen and (max-width: 860px){
  #product>.catalog>.item>.list{ width:52%;}
}



@media only screen and (max-width: 720px){
  #product>.catalog>.item>.list{ width:46%;}
  #product>.product>.prolist>ul>li{ float:none!important; width:100%; height:60px; line-height:60px; border-right:0!important;}
  #product>.product>.prolist>ul>li>a{padding:0 40px 0 20px;}
  #product>.product>.prolist>ul>li>span.open{ display:block; right:0 !important; top:0 !important; width:100% !important; height:100% !important; background:transparent !important;}
  #product>.product>.prolist>ul>li>span.close{ display:block;}
  #product>.product>.prolist>ul>li span.open{ right:18px; top:6px; width:12px; height:12px;}
  #product>.product>.prolist>ul>li span.close{ right:18px; top:6px; width:12px; height:12px;}
  #product>.search{ padding:30px 0 0 0!important;}
  #product>.search>.sear{display:none;}
  #product>.search>.sear>form{width:100%;}
  #product>.search>.container>ul>li{ width:33.33%;}
  #product>.search>.container>ul>li:nth-child(3n):after{ border-right:0!important;}
  #product>.search>.container>ul>li:nth-child(4n):after{ border-right:1px solid #eee!important;}
  #product>.search>.container>ul>li:nth-child(5n):after{ border-right:1px solid #eee!important;}
}

@media only screen and (max-width: 420px){
  #product{padding-bottom:50px;}
  #product>.catalog>.item{ min-height:inherit;}
  #product>.catalog>.item>.type{ position:relative; left:0; top:0; text-align:left; width:100%; height:auto; background:#fff;}
  #product>.catalog>.item>.type img{ position:relative; width:100px;}
  #product>.catalog>.item>.type .tit{ left:130px; top:50px; color:#333;}
  #product>.catalog>.item>.type .tit:before{ position:absolute; z-index:1; left:0; bottom:-30px; width:74px; height:20px; line-height:20px; color:#999; font-size:11px; text-align:center; border:1px solid #ddd; border-radius:3px; content:'Read more';}
  #product>.catalog>.item>.list{ display:none;}
  #product>.catalog>.item{ width:100%; float:none!important; margin-right:0 !important;}
  /*
  #product>.product>.prolist>ul>li{ float:none!important; width:100%; height:60px; line-height:60px; border-right:0!important;}
  #product>.product>.prolist>ul>li:nth-child(3n){ border-right:0px!important;}
  #product>.product>.prolist>ul>li>a{font-size:14px;line-height:60px;}
  #product>.product>.prolist>ul>li>div{ top:60px;}
  #product>.product>.prolist>ul>li>div a{ line-height:20px; font-size:14px;}*/
  #product>.product>.prolist>ul>li:nth-child(3n){ border-right:0px!important;}

  #product>.product>.path{ font-size: 16px;}
  #product>.product>.path>a{ font-size:16px;}
  #product>.product>.container>ul>li{ width:50%;}
  #product>.product>.container>ul>li:nth-child(3n):after{ border-right:1px solid #eee!important;}
  #product>.product>.container>ul>li:nth-child(2n):after{ border-right:0!important;}
  #product>.product>.container>ul>li>a>.name{ margin:0 auto; font-size:14px;}
  #product>.view>.wrap{ padding:100px 0!important;}
  #product>.view .content>.new{ top:30px; width:60px; height:60px;}
  #product>.view .content>.new>span{ padding:10px 0 0 25px; font-size:12px;}
  #product>.view .content>.tit{ font-size:32px;}
  #product>.view .content>.subtit{ font-size:20px;}
  #product>.view .content>.btn{ top:70px;}
  #product>.view .content>.btn>a{ height:30px; line-height:30px; padding:0 10px; font-size:12px;}
  #product>.view .content>.btn>a>img{ height:18px;}
  #product>.view .focus{ width:320px; height:320px;}
  #product>.view .focus .bimg{height:320px;}
  #product>.view .tag-con .con{padding:20px;font-size:12px; line-height:20px;}
  #product>.view .tag-con table td{font-size:12px;}
  #product>.view .tag-con .con .pdf{ font-size:12px;}
  #product>.view .tag-con .con .pdf>img{ height:30px;}
  #product>.view .tag-con .con .cer{ font-size:12px;}
  #product>.view .tag-con .con .cer>img{ height:30px;}
  #product>.view>.inquiry>form input, #product>.view>.inquiry>form textarea{padding:8px 2%; width:100%;}
  #product>.view>.inquiry>form .submit{display:block; text-align:center;}

  #product>.view>.related .button-next{ top:-50px; right:0; width:20px; height:20px; background-size:12px auto;}
  #product>.view>.related .button-prev{ top:-50px; right:26px; width:20px; height:20px;background-size:12px auto;}
  #product>.search>.keyword{ font-size:16px;}
  #product>.search>.container>ul>li{ width:50%;}
  #product>.search>.container>ul>li:nth-child(2n):after{ border-right:0!important;}
  #product>.search>.container>ul>li:nth-child(3n):after{ border-right:1px solid #eee!important;}
  #product>.search>.container>ul>li>a>.name{height:36px;font-size:12px;}

}

/*END*/





/*certificate TOP*/

#certificate{ width:92%; max-width:1260px; margin:0 auto; padding-bottom:100px;}
#certificate>.container{ width:100%; padding:50px 0; margin:0px auto;}
#certificate>.container>ul{ margin:0 auto;}
#certificate>.container li{position:relative;float:left; width:19.9%; overflow:hidden; margin-left:-1px; margin-top:-1px;border:1px solid #eee;text-align:center; 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;}
#certificate>.container li>a{ position:relative; display:block; padding:20px 0; min-height: 230px;width: 100%;}
#certificate>.container li>a:after{ position:absolute; z-index:2; left:0; top:0; width:100%; height:50%; font-size:14px; opacity:0; background:rgba(0,0,0,.5) url("../images/icon-zoom-magnifier.png") no-repeat 50% 40%; content:attr(data-name); text-align:center;padding-top:65%; color:#fff; transition:all .35s;}
#certificate>.container li>a>.img{ position:relative; margin:0 auto; text-align:center; overflow:hidden;}
#certificate>.container li>a>.img>img{ display:block; width:70%; height:auto; margin:0 auto; transition:all 1s;}
#certificate>.container li>a>.name{ overflow: hidden;text-overflow:ellipsis;white-space: nowrap;position:absolute; z-index:2; left:0; bottom:10px; opacity:1; width:100%; height:40px; line-height:40px; font-size:12px; text-align:center;overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#certificate>.container li>a:hover .img>img{transform:scale(1.1);}
#certificate>.container li>a:hover:after{ opacity:1;}
#certificate>.container li>a:hover .name{ opacity:0;}

@media only screen and (max-width: 960px){
  #certificate>.container{ padding:20px 0;}
  #certificate>.container li{width:32.9%;}
  #certificate>.container li>a{ min-height:inherit;}
  #certificate>.container li>a>.name{ position:relative; bottom:0;height:25px; line-height:25px;}
}
@media only screen and (max-width: 420px){
  #certificate>.container li{width:49.6%;}
}

/*END*/



/*download TOP*/

#download{ width:92%; max-width:1260px; margin:0 auto; padding-bottom:100px;}
#download>.timeaxis{ display:none; position:relative; height:40px; margin:0 auto;}
#download>.timeaxis .swiper-container{ position:absolute; left:0; top:0; width:80%;}
#download>.timeaxis a{ display:inline-block; border:1px solid #ddd; text-align:center; width:99%; height:40px; line-height:40px; margin-right:6px; color:#666; font-size:14px; transition:all .35s;}
#download>.timeaxis a:hover{ color:#d82128;}
#download>.timeaxis .A{ background:#d82128; border:1px solid #d82128; color:#fff!important;}
#download>.timeaxis .button-prev{ position:absolute; z-index:9; right:40px; top:50%; width:40px; height:40px; margin-top:-20px; opacity:.8; background: url("../images/arrow-l.png") no-repeat; background-position:50% 50%; background-size:20px auto; cursor:pointer; transition:all .35s;}
#download>.timeaxis .button-next{ position:absolute; z-index:9; right:0; top:50%; width:40px; height:40px; margin-top:-20px; opacity:.8; background:url("../images/arrow-r.png") no-repeat; background-position:50% 50%; background-size:20px auto; cursor:pointer; transition:all .35s;}
#download>.timeaxis .button-prev:hover, #download>.timeaxis .button-next:hover{ opacity:.3;}
#download>.timeaxis .swiper-button-disabled{ opacity:.1!important;}
#download>.container{ width:100%; padding:50px 0; margin:0px auto;}
#download>.container>ul{ margin:0 auto;}
#download>.container li{ display:block; float:left; width:48.8%; padding:50px 0; margin-bottom:2%; background:#f5f5f5; border:1px solid #f5f5f5; transition:all .35s;}
#download>.container li:nth-of-type(odd){ float:left;}
#download>.container li:nth-of-type(even){ float:right;}
#download>.container li>.tit{ width:80%; height:50px; line-height:25px; margin:0 auto; font-size:20px; color:#333; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
#download>.container li>.btn{ width:80%; margin:0 auto;padding-top:5px; text-align:left;}
#download>.container li>.btn>a{ position:relative; display:inline-block; padding:6px 15px; overflow:hidden; background:#d82128; border-radius:3px; color:#fff; font-size:14px; transition:all .35s;}
#download>.container li>.btn>a:after{position:absolute; z-index:1; left:0; top:0; width:0; height:100%; background:rgba(255,255,255,.1); content:''; transition:all .35s;}
#download>.container li>.btn>a>img{ height:20px; width:auto; margin-right:6px;}
#download>.container li:hover{ border:1px solid #d82128;}
#download>.container li:hover{ background:#fff;}
#download>.container li>.btn>a:hover:after{ width:100%;}

@media only screen and (max-width: 960px){
  #download{ padding:20px 0 100px 0;}
  #download>.container{ padding:20px 0;}
  #download>.container li{ float:none!important; width:100%; padding:30px 0;}
  #download>.container li>.tit{ width:90%; height:45px; line-height:22px; font-size:18px;}
  #download>.container li>.btn{ width:90%; text-align:right;}

}
@media only screen and (max-width: 420px){
  #download{ padding-bottom:50px;}
  #download>.timeaxis .swiper-container{ position:relative; left:auto; top:auto; width:70%; margin:0 auto;}
  #download>.timeaxis a{ border:0!important; width:100%; font-size:16px;}
  #download>.timeaxis .A{ background:none!important; color:#d82128!important;}
  #download>.timeaxis .button-prev{ right:auto; left:0;}
  #download>.container li>.tit{ height:36px; line-height:20px; font-size:14px;}
  #download>.container li>.btn>a{font-size:12px;}
  #download>.container li>.btn>a>img{ height:18px;}

}

/*END*/

/*contact TOP*/

#contact{ width:92%; max-width:1260px; margin:0 auto; padding-bottom:100px;}
#contact>.container{ width:100%; padding:50px 0; margin:0px auto;}
#contact>.container>.map{ position:relative;; margin:0 auto;}
#contact>.container>.map>iframe{height:660px; margin:0 auto;}
#contact>.container>.map>.content{ position:absolute; z-index:1; left:30px; top:50%; width:340px; height:560px; margin-top:-280px; background:rgba(216,33,40,1); transition:all .35s;}
#contact>.container>.map>.content:after{ position:absolute; z-index:1; left:0; bottom:0; width:100%; height:auto; background:url("../images/about-img.jpg") no-repeat; background-size: cover; content:'';}
#contact>.container>.map>.content>.tit{ position:relative; width:76%; margin:40px auto; font-size:32px; color:#fff; padding:20px 0;}
#contact>.container>.map>.content>.tit:after{ position:absolute; z-index:1; left:0; bottom:0; width:60px; height:1px; background:#fff; content:''; transition:all .35s;}
#contact>.container>.map>.content>.txt{ position:relative; width:64%; margin:0 auto 20px auto; font-size:14px; line-height:20px; color:rgba(255,255,255,.9);}
#contact>.container>.map>.content>.address:after{ position:absolute; z-index:1; top:2px; left:-22px; opacity:.9; width:18px; height:18px; background:url("../images/icon-address.png") no-repeat; background-size:100% auto; content:'';}
#contact>.container>.map>.content>.tel:after{ position:absolute; z-index:1; top:2px; left:-22px; opacity:.9; width:18px; height:18px; background:url("../images/icon-tel.png") no-repeat; background-size:100% auto; content:'';}
#contact>.container>.map>.content>.fax:after{ position:absolute; z-index:1; top:2px; left:-22px; opacity:.9;  width:18px; height:18px; background:url("../images/icon-fax.png") no-repeat; background-size:100% auto; content:'';}
#contact>.container>.map>.content>.email:after{ position:absolute; z-index:1; top:2px; left:-22px; opacity:.9; width:18px; height:18px; background:url("../images/icon-email.png") no-repeat; background-size:100% auto; content:'';}
#contact>.container>ul{ margin:0 auto;}
#contact>.container li{ position:relative; display:block; float:left; width:48.8%; padding:50px 0; margin-bottom:2%; border:1px solid #ddd; border-top:4px solid #d82128; transition:all .35s;}
#contact>.container li:nth-of-type(odd){ float:left;}
#contact>.container li:nth-of-type(even){ float:right;}
#contact>.container li>.tit{ width:86%; margin:0 auto; padding-bottom:20px;color:#d82128; font-size:20px;}
#contact>.container li>.con{ width:86%; margin:0 auto; line-height:20px; font-size:14px; color:#666;}
#contact>.container li>.con>p{ margin-bottom:5px;}


@media only screen and (max-width: 960px){
  #contact{padding-bottom:100px;}
  #contact>.container>.map>iframe{ height:360px;}
  #contact>.container>.map>.content{ position:relative; z-index:1; left:0; top:0; width:100%; height:auto; padding-bottom:30px; margin-top:0;}
  #contact>.container>.map>.content>.tit{ margin:0 auto 40px auto; width:86%;}
  #contact>.container>.map>.content>.txt{ width:80%;}
  #contact>.container{ padding:20px 0;}
  #contact>.container li{ float:none!important; width:99.6%; padding:30px 0;}

}
@media only screen and (max-width: 420px){
  #contact{padding-bottom:50px;}
  #contact>.container>.map>.content>.tit{ font-size:24px; margin:0 auto 20px auto;}
  #contact>.container>.map>.content>.txt{ width:76%;}
  #contact>.container li>.tit{ font-size:20px;}
  #contact>.container li>.con{line-height:18px; font-size:12px;}
}

/*END*/




/*footprint TOP*/
#footprint{ width:100%; margin:0 auto;}
#footprint>.tit{ display:none; padding:20px; background:#d82128;border-bottom:1px solid #ddd; font-size:18px; font-weight:bold; color:#fff;}
#footprint>.container{ padding:30px; text-align:left; margin:0 auto;}
#footprint>.container>p{ position:relative; display:block; padding:5px 12px; font-size:14px; color:#666;}
#footprint>.container>p:after{ position:absolute; z-index:1; left:0; top:50%; margin-top:-3px; width:6px; height:6px; background:#ddd; border-radius:100%; content:'';}
/*END*/


/*page TOP*/

.page{ width:90%; margin:0 auto;text-align:center; padding-top:50px;}
.page>div{ display:inline-block;}
.page>div.pageshow{ display:none;}
.page a{display:inline-block; width:auto; min-width:12px; height:32px; line-height:34px; padding:0 10px; margin:0 5px; font-size:14px; text-align:center; background:#f7f7f7; border:1px solid #eee;border-radius:2px; transition:all .35s;}
.page a:hover{ background:#fff;}
.page a.A{ background:#d82128; border:1px solid #d82128; color:#fff;}

@media only screen and (max-width: 960px){
  .page a{min-width:8px; height:28px; line-height:30px;}
}
@media only screen and (max-width: 420px){
  .page>div.pageshow{ display:inline-block; padding:0 5px; font-size:14px; color:#999;}
  .page>div.pageshow>strong{ color:#d82128;}
  .page>div.pagetrun{ display:none;}
}


/*END*/



/*kefu TOP*/

#kefu{ position:fixed; z-index:999; right:0; bottom:8%;}
#kefu>a{display:block; width:60px;height:60px; line-height:60px; text-align:center; margin-bottom:1px; transition:all .35s;}
#kefu>a>img{width:40px;height:auto;}
#kefu>a.gotop{background:#999;}
#kefu>a.call{background:rgba(216,33,40,.7);}
#kefu>a.call:hover{background:rgba(216,33,40,1);}
#kefu>a.gotop:hover{background:rgba(0,0,0,.7);}

@media only screen and (max-width: 520px){
  #kefu{ bottom:0;}
  #kefu>a{width:50px;height:50px; line-height:50px;}
  #kefu>a>img{width:30px;}
}


/*END*/

/*foot TOP*/

#foot{ position:relative; width:100%; background:#1c2633; margin:0px auto;}
#foot>.wrap{ width:100%; margin:0 auto; border-bottom:1px solid rgba(255,255,255,.1);}
#foot>.wrap:last-child{ border-bottom:0!important;}
#foot>.wrap>.container{ width:100%; max-width:1260px; margin:0 auto;}
#foot .search{ position:relative; width:40%; padding:30px 0; text-align:left;}
#foot .search>form{ display:block; width:100%; height:40px; background:#fff; border:1px solid #ddd; border-radius:3px;}
#foot .search>form input[type="text"]{outline: medium;float:left; height:40px; line-height:40px;width:70%; padding:0 5%; border:none; font-family:"Arial"; font-size:12px; background:none; box-sizing:border-box;overflow:hidden;}
#foot .search>form input::-webkit-input-placeholder{ color:#ccc;}
#go{  float:right;width:20%;height:40px;border:none; opacity:.8;background:url(../images/go.png) no-repeat center center;background-size:auto 24px;cursor:pointer;box-sizing:border-box;overflow:hidden;}
#foot .share{ width:30%; padding:30px 0; text-align:right;}
#foot .share>a{ display:inline-block; margin-left:10px; border:1px solid rgba(255,255,255,.2); border-radius:100%; transition:all .35s;}
#foot .share>a img{ height:36px;width:auto; opacity:.5; transition:all .35s;}
#foot .nav{ margin:0 auto; width:80%; border-right:1px solid rgba(255,255,255,.1);}
#foot .nav ul{ margin:0 auto; padding:50px 0;}
#foot .nav ul>li{margin-bottom: 10px; display:block; float:left; min-width:5%; max-width:15%; padding-right:8%; text-align:left;}
#foot .nav ul>li>a{ position:relative; display:block; padding:15px 0; font-size:20px; color:rgba(255,255,255,.8);}
#foot .nav ul>li>div{ display:block;}
#foot .nav ul>li>div a{ display:block; padding:5px 0; font-size:13px; color:#999; transition:all .35s;}
#foot .nav ul>li>div a:hover{ color:#ccc; text-decoration:underline;}
#foot .contact{ width:8%; text-align:right;}
#foot .contact .qrcode{ width:100%; margin:30px auto 0 auto; padding:10px 0; text-align:left;}
#foot .contact .qrcode>img{ width:100%; height:auto; margin:0 auto;}
#foot .contact .text{ width:100%; margin:0 auto; text-align:left; font-size:18px; font-weight:normal; line-height:22px; color:rgba(255,255,255,.5);}
#foot .contact .text>h3{ display:block;padding:6px 0; font-size:14px; font-weight:normal; color:#ccc; line-height:18px;}
#foot .copyright{ width:100%; max-width:1260px; padding:50px 0; margin:0 auto;}
#foot .copyright .copy{ width:60%; text-align:left; color:#999; font-size:14px;}
#foot .copyright .copy>a{ display:inline-block; padding:0 5px; color:rgba(255,255,255,.1); transition:all .35s;}
#foot .copyright .url{ width:40%; text-align:right;color:#999; font-size:14px;}
#foot .copyright .url>a{ display:inline-block; padding:0 5px; color:#999; transition:all .35s;}
#foot .copyright .url>a:hover{ color:#ccc; text-decoration:underline;}

@media only screen and (max-width: 1280px){
  #foot>.wrap>.container{ width:90%; max-width:inherit; }
  #foot .copyright{ width:90%; max-width:inherit;}
  #foot .contact .text{ font-size:14px; line-height:20px;}

}

@media only screen and (max-width: 960px){
  #foot>.wrap{ width:92%;}
  #foot .nav{width:80%;border-right:0!important;}
  #foot .nav ul>li{ width:50%; min-width:inherit; max-width:inherit; padding-right:0!important;}
  #foot .nav ul>li>a{ font-size:16px; padding:10px 0;}
  #foot .nav ul>li>div{ display:none;}
  #foot .contact{ width:20%; text-align:left;}
  #foot .contact .text{ display:none;}
  #foot .copyright .copy{ width:100%; }
  #foot .copyright .url{ display:none;}
}

@media only screen and (max-width: 420px){
  #foot .search{ float:none!important; width:80%; padding:30px 0 20px 0;margin:0 auto;}
  #foot .share{ float:none!important; width:100%; padding:0 0 20px 0 !important; margin:0 auto; text-align:center;}
  #foot .share>a{ margin-right:10px; margin-left:0 !important;}
  #foot .share>a img{ height:26px;}
  #foot .nav ul{ padding:20px 0;}
  #foot .nav ul>li>a{ font-size:14px;}
  #foot .copyright{ padding:20px 0;}
  #foot .copyright .copy{ font-size:12px;}
  #foot .copyright .copy>span{ display:block;}
  #foot .copyright .copy>a{ display:block; padding:0;}
}

/*END*/