﻿* {
  outline: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  -webkit-text-size-adjust: 100%
}
body {
  padding: 0;
  margin: 0 auto;
  color: #222222;
  background: #fff;
  font-size: .16rem; 
  overflow-x: hidden;
  position: relative;
  
  -webkit-text-size-adjust: none;
  
  -webkit-tap-highlight: rgba(0, 0, 0, 0);
  
  
}
input[type="button"], input[type="submit"], input[type="reset"] {
  -webkit-appearance: none;
}
ul, li, form, dl, dt, dd, div, ol, figure, article, nav, menu, aside, pre {
  padding: 0;
  margin: 0;
}
.ul, .ul li,.ol, .ol li {
  list-style: none;
}
table, table td {
  border-collapse: collapse;
}
table {
  border-spacing: 0;
}
table td, select, input, textarea {
  font-size: .16rem;
}
select, input, textarea {
  border-radius: 0;
  -webkit-border-radius: 0;
}

img {
  border: none;
  max-width: 100%;
  vertical-align: middle;
}
a {
  color: #222222;
  text-decoration: none;
  -webkit-tap-highlight-color:rgba(0, 0, 0, 0); 
}
a:hover {
  color: #007c00;
  text-decoration: none;
}
a:focus {
  color: #333;
  outline: none;
  -moz-outline: none;
}
a:active {
  color: #333;
}
pre {
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
  text-align: justify;
  text-justify: inter-ideograph;
}
.clear {
  clear: both;
  height: 0px;
  overflow: hidden;
  zoom: 0;
}
.clearfix:after {
  content: '';
  display: block;
  height: 0;
  clear: both;
}
.dot {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.dot2, .dot3, .dot4, .dot5, .dot6 {
  display: -webkit-box;
  display: box;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  -webkit-box-orient: vertical;
}
.dot2 {
  -webkit-line-clamp: 2;
}
.dot3 {
  -webkit-line-clamp: 3;
}
.dot4 {
  -webkit-line-clamp: 4;
}
.dot5 {
  -webkit-line-clamp: 5;
}
.dot6 {
  -webkit-line-clamp: 6;
}
.ytable {
  display: table;
  width: 100%;
}
.ytable-fixed {
  table-layout: fixed;
}
.ytable-cell {
  display: table-cell;
  vertical-align: middle;
}
@media (max-width:1024px) {
  .ytable.xy,
  .ytable.xy > .ytable-cell{display: block;}
}

:after, :before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}
select.select-css {
	border: solid 1px #000;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
    background-repeat:  no-repeat;
    background-position:  98% center;
    background-color:  transparent;
	padding-right: 20px;
    padding-left: 10px;
}


select.select-css::-ms-expand {
display: none;
}


.img-block{
    display: block; 
    width: 100%;
}


.grayscale{filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");-webkit-filter:grayscale(1);filter:grayscale(1);filter:gray}.grayscale.grayscale-fade{transition:filter .5s;}@media screen and (-webkit-min-device-pixel-ratio:0){.grayscale.grayscale-fade{-webkit-transition:-webkit-filter .5s;transition:-webkit-filter .5s;}}.grayscale.grayscale-fade:hover,.grayscale.grayscale-off{-webkit-filter:grayscale(0);filter:grayscale(0)}.grayscale.grayscale-replaced{-webkit-filter:none;filter:none}.grayscale.grayscale-replaced>svg{-webkit-transition:opacity .5s ease;transition:opacity .5s ease;opacity:0}.flipInY .grayscale.grayscale-replaced>svg {opacity:1;}.grayscale.grayscale-replaced.grayscale-fade:hover>svg,.grayscale.grayscale-replaced.grayscale-off>svg{opacity:0}



.open-search{cursor: pointer; position: relative}
.open-search[rel="absolute"]{position: absolute; top: 50%;}
.open-search[rel="relative"]{position: relative;}
.search.on .open-search{background: none!important;}
.search.on .open-search:before,
.search.on .open-search:after{position: absolute; content: ''; width: 70%; left: 15%; height: 3px; top: 50%; margin-top: -1.5px;background: #fff;transform: rotate(45deg);-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg); transition: 0.5s; background: #ee8100}
.search.on .open-search:after{transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg);}

.top-search .text.focus{color: #333;}


@media(max-width:1024px){
body.menu-show{overflow: hidden;}

.open-menu{z-index: 10; width: 40px; height: 40px;}
.open-menu[rel="relative"]{position: relative;}
.open-menu[rel="absolute"]{position: absolute; top: 50%; transform: translateY(-50%);}
.open-menu i{position: absolute; width: 100%; height: 3px; background: #fff; left: 0; top: 50%; margin-top: -1.5px; transition: 0.3s;}
.open-menu:not(.on) i:nth-child(1){margin-top: -10px;}
.open-menu:not(.on) i:nth-child(3){margin-top: 8px;}

.open-menu.on i:nth-child(2){opacity: 0;}
.open-menu.on i:nth-child(1){transform: rotate(-45deg);}
.open-menu.on i:nth-child(3){transform: rotate(45deg);}
}


@media(min-width:1025px){
.top-sub{position: absolute; top: 100%; z-index: 100;}
}
@media(max-width:1024px){
.has-multi aside,
.has-sub span{position: relative;padding-right: 40px; overflow: hidden;}
.has-multi aside .op-multi,
.has-sub span .op{position: absolute;width: 100%;height: 100%;transition: 0.3s; right: 0; top: 0; z-index: 10}
.has-multi aside .op-multi em,
.has-sub span .op em{position: absolute; width: 40px; height: 100%;  transition: 0.3s; right: 0; top: 0; z-index: 10;transition: 0.3s;font-style: normal }
.has-sub span .op.click em{transform: rotate(45deg);}
.has-multi aside .op-multi em:before,
.has-multi aside .op-multi em:after,
.has-sub span .op em:before,
.has-sub span .op em:after{position: absolute; content: ''; width: 12px; height: 2px;background: #ee8100; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.has-multi aside .op-multi em:after,
.has-sub span .op em:after{ width: 2px; height: 12px;}
.has-multi aside .op-multi em:before,
.has-multi aside .op-multi em:after{background-color: #666;}
.has-sub span:after,
.has-multi aside:after{content: '';position: absolute; left: 0;top: 0; width: 100%; height: 100%; cursor: pointer;}
.has-multi aside .op-multi{right: 5px; bottom: 0; margin: auto; height:34px;}
.has-multi aside .op-multi em:before{display: none}
.has-multi aside .op-multi em:after{width:8px; height: 8px;left: 0;right: 0; top: 0; bottom: 0; margin: auto; transform: rotate(45deg); border-bottom: solid 1px #181818; border-right: solid 1px #181818; background:none}
.has-multi aside .op-multi.click em{transform: rotate(175deg)}
}



.whir-fade-left{transform: translate(-30px,0); }
.whir-fade-right{transform: translate(30px,0);}
.whir-fade-up{transform: translate(0,30px);}
.whir-fade-down{transform: translate(0,-30px);}
.whir-zoom-in{transform: scale(0);}
[class*=whir-]{opacity: 0;transition-property: all;transition-duration: 1.2s;}
.active [class*=whir-]{opacity: 1;}
.active [class*=whir-fade]{transform: translate(0,0);}
.active [class*=whir-zoom]{transform: scale(1);}



.auto{width:82%; max-width:1560px;margin: 0 auto;}
@media (max-width:1400px) {
.auto{width:92%;}
}

.main{padding-top: 5%; padding-bottom: 5%;}

.flex,
.flex_js,
.flex_jc,
.flex_ac,
.flex_js_ac,
.flex_jc_ac {
  display: flex;
  flex-wrap: wrap;
}
.flex_js {  justify-content: space-between;}
.flex_jc {  justify-content: center;}
.flex_ac {  align-items: center;}
.flex_js_ac {  justify-content: space-between;  align-items: center;}
.flex_jc_ac {  justify-content: center;  align-items: center;}

figure{ position: relative; overflow: hidden}

.img-mid figure{ padding-bottom: 100%;}
.img-mid figure img{position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 100%; height: 100%; object-fit: cover; -o-object-fit: cover}
.img-mid[rel="full"] figure img{object-fit: contain; -o-object-fit: contain}

.img-zoom figure img{
-webkit-transition: -webkit-transform 1.2s ease;
transition: -webkit-transform 1.2s ease;
transition: transform 1.2s ease;
transition: transform 1.2s ease,-webkit-transform 1.2s ease;
}
.img-zoom .item:hover figure img{ -webkit-transform:scale(1.2);transform:scale(1.2)}


.ul h4,
.ul p,
.item h4,
.item p,
.mp{padding: 0; margin: 0; font-weight: normal}
.c_yellow{color:#ee8100}
.c_666666{color:#666666}
.c_999999{color:#999999}

html{font-size:100px}
body{font-size: calc(16/var(--winvw));line-height:1.875;}
:root{--winvw:1920*100vw}
@media (max-width:1600px) {
:root{--winvw:1700*100vw}
}
@media (max-width:1400px) {
:root{--winvw:1500*100vw}
}
@media (max-width:1200px) {
:root{--winvw:1300*100vw}
}
@media (max-width:960px) {
:root{--winvw:1200*100vw}
}
@media (max-width:768px) {
:root{--winvw:1000*100vw}
}
@media (max-width:640px) {
:root{--winvw:600*100vw}
}
@media (max-width:480px) {
:root{--winvw:480*100vw}
}

.fs12{font-size: 12px}
.fs14{font-size: 14px}
.fs16{font-size: calc(16/var(--winvw))}
.fs18{font-size: calc(18/var(--winvw))}
.fs20{font-size: calc(20/var(--winvw))}
.fs24{font-size: calc(24/var(--winvw))}
.fs30{font-size: calc(30/var(--winvw))}
.fs36{font-size: calc(36/var(--winvw))}
.fs48{font-size: calc(48/var(--winvw))}
@media (max-width:1024px) {
.fs48{font-size: calc(36/var(--winvw))}
}
@media (max-width:768px) {

}


@keyframes scale {
 0% {
transform: scale(1);
-webkit-transform: scale(1);
-ms-transform: scale(1);
}
 50% {
transform: scale(0.8);
-webkit-transform: scale(0.8);
-ms-transform: scale(0.8);
}
 100% {
transform: scale(1);
-webkit-transform: scale(1);
-ms-transform: scale(1);
}
}
@-webkit-keyframes scale {
 0% {
transform: scale(1);
-webkit-transform: scale(1);
-ms-transform: scale(1);
}
 50% {
transform: scale(0.8);
-webkit-transform: scale(0.8);
-ms-transform: scale(0.8);
}
 100% {
transform: scale(1);
-webkit-transform: scale(1);
-ms-transform: scale(1);
}
}
@-ms-keyframes scale {
 0% {
transform: scale(1);
-webkit-transform: scale(1);
-ms-transform: scale(1);
}
 50% {
transform: scale(0.8);
-webkit-transform: scale(0.8);
-ms-transform: scale(0.8);
}
 100% {
transform: scale(1);
-webkit-transform: scale(1);
-ms-transform: scale(1);
}
}