﻿
html,body,div,span,object,iframe,table,tr,th,td,em,img,h1,h2,h3,h4,h5,h6,p,a,dl,dt,dd,ul,li,ol,form,label {
  border: 0 none;
  font-family: inherit;
  font-style: inherit;
  margin: 0;
  padding: 0;
}
body {
  color: #000;
  font-family: "微软雅黑";
  font-size: 18px;
}
input,
select {
  font-size: 12px;
  line-height: 16px;
}
img {
  border: none;
  display: block;
}
a {
  text-decoration: none;
}
ul,
li,ol {list-style-type: none}

em,i{ font-style:normal}
.tc{ text-align: center}
.pr{ position: relative}
.fl{ float: left}
.fr{ float: right}
.auto{margin: 0 auto}
.ov{ overflow: hidden}
.clear{ clear: both;}


.sidebar{ width:240px; float: left; background: #47304e;max-height: 100%;position: fixed;top:0;height: 100%;bottom: 0;
  width: 260px;left: 0;z-index: 1030;
  -webkit-box-shadow: 0px 2px 22px 0 rgba(0, 0, 0, 0.2), 0px 2px 30px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0px 2px 22px 0 rgba(0, 0, 0, 0.2), 0px 2px 30px 0 rgba(0, 0, 0, 0.35);
  animation: bounceInLeft 1s; -webkit-animation: bounceInLeft 1s
}
.sidebar .logo{ text-align: center; padding: 10% 0; background: #fff; height:15%;}
.sidebar .logo img{ display: inline-block; height:100%;}
.sidebar .nav { height:85%;}
.sidebar .nav ul li{ width:90%; padding:6% 0 6% 10%; font-size: 20px; border-bottom: 1px solid #6d5f72}
.sidebar .nav ul li a{ color: #fff}
.sidebar .nav ul li.active{ background: rgba(255,255,255,0.5)}
.sidebar .bt{ position: absolute; bottom:0; left:0; width:80%; color: #616161; background: #fff; padding:3% 10%;}
.sidebar .bt em{ display: inline-block; vertical-align: middle; margin-right: 5px}
.sidebar .bt p{ font-size: 15px; color: #8a8a8a}
.sidebar .bt i{ font-size: 27px; line-height: 45px}

.main{position: relative;float: right;width: calc(100% - 240px);background-color: #f3f4f5; padding-bottom: 130px}
.main .toper{ position: relative; height:250px; background: url(../images/toper-bg.jpg) no-repeat left top; background-size:cover}
.main .toper img{ float: left;}
.main .toper span{ display: block; width:290px; float: left; color: #fff; padding-top: 40px}
.main .toper span h3{ font-weight: normal; font-size: 51px}
.main .toper span i{ font-size: 30px; margin-left: 10px}
.main .toper span p{ line-height: 35px}
.main .toper span a{ color: #ff0606}
.main .con{ background: #fff; border-bottom: 1px solid #dcdcdc; padding:1% 3%}
.main .con ul{ overflow: hidden;}
.main .con ul li{ display: inline-block; vertical-align: middle}
.main .con span{ font-size: 22px}
.main .con span i{ display: inline-block; vertical-align: middle; margin-right: 5px}
.main .con span b{ font-size: 27px; color: #f79436}
.main .con p{ font-size: 24px; color: #49497b}
.main .con p i{ margin-right: 1%}
.main .con li.i4{ width:250px;}
.main .con li small{font-size: 21px; color: #148bdc; padding:5px 0 0 10px;}
.main .con li:nth-last-child(1){ margin-right: 0}
.main .list{ padding: 2% 5%;}
.main .list ul li{ overflow: hidden; padding-bottom: 2%;
  animation-name: fadeInLeft;
  -webkit-animation-name: fadeInLeft;
  animation-timing-function: linear;
  animation-play-state: running;
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.main .list ul li:nth-child(1){animation-delay: 1s;-webkit-animation-delay: 1s;}
.main .list ul li:nth-child(2){animation-delay: 2s;-webkit-animation-delay: 2s;}
.main .list ul li:nth-child(3){animation-delay: 3s;-webkit-animation-delay: 3s;}

.main .list i{ float: left; margin-right: 2%; width:6%;}
.main .list i img{ width:100%;}
.main .list p{  float: left; background: #fff; border: 1px solid #f3f3f3; padding:1.5% 2%; 
  color: #666; font-size: 23px; border-radius: 10px; position: relative}
.main .list p::before{ content: ""; display: block; width:9px; height:16px;
  background: url(../images/jt.png) no-repeat; position: absolute; left:-8px; top:0; bottom:0; margin:auto 0;
}

.main .que{position: fixed; bottom:0; right:0; width: calc(100% - 240px); background: #f3f4f5}
.main .que ul{  background: #ddedff; padding: 1% 0 1% 5%; }
.main .que ul li{ display: inline-block; vertical-align: middle; margin-right: 2%}
.main .que ul li i{ display: inline-block; vertical-align: middle;}
.main .que ul li a{ color: #353434}
.main .que .que-con { padding: 1% 5%}
.main .que .que-con input{width: 70%;line-height:60px;height:60px;font-size: .28rem;color: #666;
  border: 1px solid #ddd; border-radius: 10px; padding-left: 2%;font-size:20px; outline: none}
.main .que .que-con a{ display:inline-block; width:10%; color: #fff; text-align: center; line-height:60px;
   border-radius:10px; position: relative; margin-left: 2%}
.main .que .que-con a:nth-child(2){ background: #00b7ee}
.main .que .que-con a:nth-child(3){ background: #e60000}
.main .que .que-con span{ display: block; width:28px; height:28px; line-height: 28px; border-radius: 50%;background: #e60000;
  position: absolute; top:-10px; right:5px;font-size: 16px}

@media screen and (max-width: 2500px) {
  .main .con li{ margin-right: 2%; }
}
@media screen and (max-width: 1500px) {
  .main .con li{ margin-right:1%}
}
@media screen and (max-width: 1450px) {
  .main .con li{ margin-right:0.5%}
}

@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-300px);transform:translateX(-300px)}60%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}80%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-300px);-ms-transform:translateX(-300px);transform:translateX(-300px)}60%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}80%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}
@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}