﻿
html,
body {
 width: 100%;
 height: 100%;
 font-size: 16px;
}

.wrap {
 background: #f3f5f9;
}

.header {
 height: 70px;
 background: #36d1c8;
}

.header .header_ul {
 float: right;
}

.header .header_ul li {
 float: left;
 padding: 0 60px;
}

.header .header_ul li a {
 color: #fff;
 font-size: 18px;
 line-height: 70px;
 transition: all 0.3s;
}

.header .header_ul li a:hover {
 font-weight: bold;
}

.header .header_ul li span {
 color: #fff;
 font-size: 18px;
}

.footer {
 height: 100px;
}

.fot_in {
 margin-top: 20px;
}

.fot_left {
 height: 100px;
 margin-left: 17%;
}

.fot_left p {
 line-height: 28px;
 color: #666666;
 white-space: nowrap;
}

.fot_left .pic1 {
 float: left;
 margin-right: 20px;
}

.fot_left .pic1 img {
 width: 62px;
}

.fot_right {
 color: #666;
 margin-right: 2%;
 line-height: 28px;
}

.guide {
 /*background: url(/Sites/Uploaded/UserUpLoad/20180808/20180808134035.jpg) no-repeat;*/
 width: 100%;
 height: auto;
 position: relative;
}
.guide .bg{
 width: 100%;
 height: auto;
 display: block;
}
@media only screen and (max-width:1279px){
 .guide .bg{display: none}
}
.banner_in {
 position: absolute;
 height: 100%;
 width: 1200px;
 left: 0;
 right: 0;
 margin: 0 auto;
 overflow: hidden;
 top: 0;
}

.banner_in .banner_con {
 color: #fff;
 font-size: 20px;
 line-height: 27px;
 font-weight: 400;
 width: 483px;
 height: 152px;
 letter-spacing: 3px;
 padding: 18px 28px 0;
 position: absolute;
 background: url(/Sites/Uploaded/UserUpLoad/20180801/20180801095855.png);
 left: 0;
 bottom: 36px;
}

.banner_in .banner_ewm {
 position: absolute;
 width: 390px;
 height: 211px;
 bottom: 36px;
 right: 0;
}

.links ul {
 display: flex;
}

.links>li {
 width: 33.333%;
 height: 317px;
 float: left;
 background: #fff;
}

.links li.zhuanye {
 border-left: 4px solid #f3f5f9;
 border-right: 4px solid #f3f5f9;
 box-sizing: border-box;
}

.links>li h1 {
 height: 100px;
 line-height: 100px;
 color: #000;
 font-size: 33px;
 font-weight: 400;
 text-align: center;
}

.links>li div {
 padding: 0 40px;
 color: #000;
 font-size: 16px;
 line-height: 28px;
 font-weight: 400;
 letter-spacing: 3px;
}

.links>li div img {
 float: left;
 margin-right: 40px;
}

.links>li div a {
 display: block;
 margin: 0 auto;
 width: 173px;
 height: 37px;
 background: #36d1c8;
 text-align: center;
 line-height: 37px;
 color: #fff;
 font-weight: 400;
 margin-top: 20px;
 transition: all 0.3s;
}

.links>li div a:hover {
 background: #fff;
 color: #000;
 border: 1px solid #000;
}

.header_phone {
 display: none;
 background: #28b5a9;
}

.header_phone a {
 display: block;
 margin: 0px auto;
 width: 100%;
 text-align: center;
 padding: 10px 0;
}

.footer_phone {
 background: #f3f5f9;
 display: none;
 text-align: center;
 padding: 10px 0;
}

.phone_links {
 display: none;
 overflow: hidden;
 position: absolute;
 top: 50%;
 margin-top: -115px;
 left: 50%;
 margin-left: -150px;
}

.phone_links li {
 margin: 20px auto;
 width: 300px;
}

.phone_links li a {
 color: #fff;
 background: #28b5a9;
 height: 50px;
 line-height: 50px;
 text-align: center;
 width: 300px;
 display: block;
}

@media screen and (max-width:1440px) {
 .w {
 width: 980px;
 }
 .guide {
 background-size: contain;
 height: auto;
 }
 .banner_in {
 height: 570px;
 }
 .links>li div {
 line-height: 19px;
 min-height: 171px;
 position: relative;
 }
 .links>li div a{
  position: absolute;
  bottom:0;
  left: 50%;
  margin-left: -86px;
 }
 .fot_left {
 margin-left: 1%;
 }
}
@media screen and (max-width:1280px) {
 .banner_in {
 height: 530px;
 }
 .links>li h1{
 height: 80px;
 line-height: 80px;
 }
 .links>li div img{
 margin-right: 35px;
 margin-top: 10px;
 }
}

@media (max-width:1279px) {
 .header,
 .footer,
 .links,
 .banner_in {
 display: none;
 }
 .header_phone,
 .footer_phone,
 .phone_links {
 display: block;
 }
 .guide {
 height: 800px;
 background: url(/Sites/Uploaded/UserUpLoad/20180801/20180801132628.jpg);
 background-size: 100% 100%;
 }
}

@media (max-width:450px) {
 .guide {
 height: 534px;
 }
}

@media (max-height:420px) {
 .phone_links {
 top: 96px;
 margin-top: 0;
 }
}  