@charset "utf-8";
/* Css Document */
@font-face {
  font-family:"Montserrat-Regular-8";
  src:url("../Fonts/Montserrat-Regular-8.woff2") format("woff2"),
      url("../Fonts/Montserrat-Regular-8.woff") format("woff"),
      url("../Fonts/Montserrat-Regular-8.ttf") format("truetype"),
      url("../Fonts/Montserrat-Regular-8.eot") format("embedded-opentype"),
      url("../Fonts/Montserrat-Regular-8.svg") format("svg");
  font-weight:normal;
  font-style:normal;
}
@font-face {
  font-family:"Montserrat-Bold-3";
  src:url("../Fonts/Montserrat-Bold-3.woff2") format("woff2"),
      url("../Fonts/Montserrat-Bold-3.woff") format("woff"),
      url("../Fonts/Montserrat-Bold-3.ttf") format("truetype"),
      url("../Fonts/Montserrat-Bold-3.eot") format("embedded-opentype"),
      url("../Fonts/Montserrat-Bold-3.svg") format("svg");
  font-weight:normal;
  font-style:normal;
}
*, *:after, *:before{ box-sizing:border-box; -webkit-box-sizing:border-box;}
html{ font-family:"Montserrat-Regular-8","Source Han Sans CN","PingFang SC","Microsoft YaHei"; font-size:14px; color:#333; line-height:28px;}
html{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
body{ background-color:#fff; width:expression(document.body.clientWidth <= 320? "320px": "auto"); min-width:320px; background-color:#f0f0f0;}
body,div,ul,li,dl,dt,dd,ol,form,a,span,p,h1,h2,h3,h4,h5,h6,label,table,tbody,tr,th,td,object,iframe,icon{ margin:0; padding:0;}
html,body{ height:100%;}
img{ border:none; vertical-align:bottom;}
ul,li{ list-style-type:none;}
a{ color:#333; text-decoration:none;}
a:hover{ color:#1350a8;}
a{ outline: none;}
a:active{ star:expression(this.onFocus=this.blur());}
:focus{ outline:0;}
.clear{ width:0; height:0; padding:0; margin:0; clear:both;}
.margin{ margin-top:100px;}
@media screen and (max-width:1024px){.margin{ margin-top:65px;}}
@media screen and (max-width:800px){.margin{ margin-top:50px;}}
@media screen and (max-width:480px){.margin{ margin-top:35px;}}
.main{ margin:0 5%;}
@media screen and (max-width:1024px){.main{ margin:0 3.5%;}}
::-webkit-scrollbar{ width:8px;}
::-webkit-scrollbar-track{ background:#f0f0f0;}
::-webkit-scrollbar-thumb{ background:#c0c0c0;}
::-webkit-scrollbar-thumb:window-inactive{ background:#c0c0c0;}
::-webkit-scrollbar-thumb:vertical:hover{ background:#c0c0c0;}
@media screen and (max-width:1024px){::-webkit-scrollbar{ width:0;}}

/* Css Top */
.db-bg{ position:fixed; top:0; left:0; z-index:100; width:100%; height:80px; background-color:rgba(0, 0, 0, 0); -webkit-transition:all .5s ease-in-out; transition:all .5s ease-in-out;}
.db-bg .db-sj{ display:none;}
.db-bg .db-sj a{ display:block; position:absolute; left:3.5%; top:0; width:20px; height:50px;}
.db-bg .db-sj a span{ display:block; position:absolute; left:0; top:50%; width:20px; height:2px; margin-top:-1px; background-color:#fff;}
.db-bg .db-sj a span::before,.db-bg .db-sj span::after{ content:''; position:absolute; width:100%; height:100%; left:0; background-color:inherit;}
.db-bg .db-sj a span::before{ bottom:6px;}
.db-bg .db-sj a span::after{ top:6px;}
.db-bg .db-lg{ float:left; width:216px; height:48px; margin-top:19px; background:url(../Images/logo.png) no-repeat; background-size:216px 48px;}
.db-bg .db-lg a{ display:block; width:100%; height:100%;}
.db-bg .db-yb{ float:right;}
.db-bg .db-yb li{ float:left; width:30px; height:30px; border:1px solid #fff; margin:25px 0 0 15px; background-repeat:no-repeat; background-position:center; background-size:20px 20px; cursor:pointer; position:relative; -webkit-border-radius:50%; border-radius:50%; -webkit-transition:all .3s ease-in-out; transition:all .3s ease-in-out;}
.db-bg .db-yb li:nth-of-type(4){ display:none;}
.db-bg .db-yb li:hover{ border-color:#1350a8; background-color:#1350a8;}
.db-bg .db-yb li div{ position:absolute; left:0; top:45px; z-index:1000; width:100px; height:0; overflow:hidden; opacity:0; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.db-bg .db-yb li div img{ width:100%; -webkit-border-radius:3px; border-radius:3px;}
.db-bg .db-yb li a{ display:block; width:100%; height:100%;}
.db-bg .db-yb li:hover div{ height:120px; opacity:1;}
.db-bg .db-ls{ float:right; margin-right:15px;}
.db-bg .db-ls a{ display:block; float:left; height:28px; line-height:27px; margin:26px 2px 0; padding:1px 15px 0; font-size:16px; color:#fff; background-color:rgba(19, 80, 168, 0); -webkit-border-radius:25px; border-radius:25px; -webkit-transition:all .3s ease-in-out; transition:all .3s ease-in-out;}
#index .db-bg .db-ls a:nth-of-type(1), #about .db-bg .db-ls a:nth-of-type(2), #dishwasher .db-bg .db-ls a:nth-of-type(3), #garbage .db-bg .db-ls a:nth-of-type(4), #service .db-bg .db-ls a:nth-of-type(5), #contact .db-bg .db-ls a:nth-of-type(6), .db-bg .db-ls a:hover{ background-color:rgba(19, 80, 168, 1);}
.db-bg.smaller{ background-color:rgba(0, 0, 0, .85);}
@media screen and (max-width:1280px){
.db-bg .db-yb li{ margin-left:10px;}
.db-bg .db-ls{ margin-right:5px;}
.db-bg .db-ls a{ padding:0 10px;}
}
@media screen and (max-width:1024px){
.db-bg{ height:50px; padding:0 3.5%; background-color:rgba(0, 0, 0, .85);}
.db-bg .db-sj{ display:block;}
.db-bg .db-lg{ float:inherit; width:126px; height:28px; background-size:126px 28px; margin:10px auto 0;}
.db-bg .db-yb{ float:inherit; position:absolute; right:3.5%; top:0;}
.db-bg .db-yb li{ width:24px; height:24px; margin-top:13px; background-size:16px 16px;}
.db-bg .db-yb li:nth-of-type(1), .db-bg .db-yb li:nth-of-type(2), .db-bg .db-yb li:nth-of-type(3){ display:none;}
.db-bg .db-yb li:nth-of-type(4){ display:block;}
.db-bg .db-ls{ display:none;}
.division{ width:100%; height:50px;}
}

/* Css Tools */
.tl-bg{ width:100%; height:250px; background:url(../Images/iconBg.jpg) no-repeat center; background-size:cover;}
.tools{ margin-top:120px;}
.tl-bg a{ display:block; float:left; width:25%; color:#fff; text-align:center; padding-top:65px; -webkit-transition:all .3s ease-in-out; transition:all .3s ease-in-out;}
.tl-bg a:hover{ padding-top:50px;}
.tl-bg a img{ width:50px; height:50px;}
.tl-bg a h3{ font-size:18px; font-weight:500; margin:15px 0 3px;}
@media screen and (max-width:1024px){
.tools{ margin-top:77px;}
}
@media screen and (max-width:800px){
.tl-bg{ height:auto; padding-bottom:35px;}
.tools{ margin-top:50px;}
.tl-bg a{ width:50%; padding-top:35px; font-size:12px;}
.tl-bg a:hover{ padding-top:35px;}
.tl-bg a img{ width:38px; height:38px;}
.tl-bg a h3{ font-size:16px; line-height:20px; margin:14px 0 0;}
}
@media screen and (max-width:480px){
.tools{ margin-top:35px;}
}

/* Css Footer */
.cy-bg{ width:100%; height:80px; line-height:80px; color:#fff; background-color:#1350a8;}
.cy-bg span{ display:none;}
.cy-bg dl{ float:right; width:253px; height:19px; margin-top:31px; background:url(../Images/tel.png) no-repeat;}
@media screen and (max-width:800px){
.cy-bg{ height:auto; line-height:22px; text-align:center; padding:22px 0 25px;}
.cy-bg dl{ float:inherit; width:200px; height:15px; margin:10px auto 0; background-size:200px 15px;}
}
@media screen and (max-width:414px){
.cy-bg span{ display:inline;}
}