/*
*   9-30 ki ����ָ��
**
*/
body {
  position: relative;
}
.tools-bg {
  background: url('/images/tool-bg.jpg') no-repeat center center;
  width: 100%;
  height: 359px;
}
.tools-bg .ct {
  text-align: center;
  padding-top: 115px;
}
.tools-bg .ct h2 {
  font-size: 24px;
  color: #ffffff;
  margin-top: 10px;
}
.tools-bg .ct h3 {
  font-size: 16px;
  color: #c5c5c5;
}
.start-box {
  padding-bottom: 245px;
}
.start-wrap {
  overflow: hidden;
  margin-top: 65px;
  margin-left: 80px;
}
.start-wrap .mt-30 {
  margin-top: 30px;
}
.show-lt,
.show-ct,
.show-rt {
  float: left;
  width: 33.33%;
  text-align: center;
}
.show-lt div,
.show-ct div,
.show-rt div {
  width: 280px;
  height: 145px;
  background: #f2f2f2;
  padding-top: 25px;
}
.show-lt div h2,
.show-ct div h2,
.show-rt div h2 {
  font-size: 14px;
  color: #323232;
}
.show-lt div h3,
.show-ct div h3,
.show-rt div h3 {
  font-size: 14px;
  color: #909090;
}
.show-lt h4,
.show-ct h4,
.show-rt h4,
.show-lt h5,
.show-ct h5,
.show-rt h5,
.show-lt p,
.show-ct p,
.show-rt p {
  text-align: left;
  width: 280px;
}
.show-lt h4,
.show-ct h4,
.show-rt h4 {
  font-size: 18px;
  color: #525252;
  margin-top: 20px;
}
.show-lt h5,
.show-ct h5,
.show-rt h5 {
  font-size: 14px;
  color: #707070;
  padding-bottom: 15px;
  border-bottom: 1px solid #F2F2F2;
}
.show-lt p,
.show-ct p,
.show-rt p {
  color: #848484;
  margin-top: 15px;
}
.book-box {
  margin-top: 70px;
  margin-bottom: 125px;
}
.book-wrap {
  height: 400px;
}
.book-lt,
.book-ct,
.book-rt {
  float: left;
  width: 29%;
  text-align: center;
  margin-bottom: 40px;
  margin-right: 40px;
  cursor: pointer;
}
.book-lt div,
.book-ct div,
.book-rt div {
  width: 360px;
  height: 240px;
  padding-top: 120px;
  background: #F8F8F8;
}
.book-lt div h2,
.book-ct div h2,
.book-rt div h2 {
  font-size: 16px;
  color: #525252;
  margin-top: 30px;
  font-weight: 900;
}
.book-lt .b-icon,
.book-ct .b-icon,
.book-rt .b-icon {
  background-image: url("/images/book-icon.png");
  display: block;
  margin: 0 auto;
}
.book-lt .pic-6,
.book-ct .pic-6,
.book-rt .pic-6 {
  background-position: 0px -75px;
  width: 60px;
  height: 76px;
}
.book-lt .pic-7,
.book-ct .pic-7,
.book-rt .pic-7 {
  background-position: -60px -74px;
  width: 70px;
  height: 63px;
}
.book-lt .pic-8,
.book-ct .pic-8,
.book-rt .pic-8 {
  background-position: -130px -74px;
  width: 70px;
  height: 64px;
}
.book-lt .pic-9,
.book-ct .pic-9,
.book-rt .pic-9 {
  background-position: -200px -74px;
  width: 70px;
  height: 70px;
}
.book-lt .pic-3,
.book-ct .pic-3,
.book-rt .pic-3 {
  background-position: -140px 0px;
  width: 76px;
  height: 66px;
}
.book-lt .pic-1,
.book-ct .pic-1,
.book-rt .pic-1 {
  background-position: 0px 0px;
  width: 66px;
  height: 75px;
}
.book-lt .pic-4,
.book-ct .pic-4,
.book-rt .pic-4 {
  background-position: -216px 0px;
  width: 76px;
  height: 63px;
}
.book-lt .pic-2,
.book-ct .pic-2,
.book-rt .pic-2 {
  background-position: -66px 0px;
  width: 74px;
  height: 61px;
}
.book-lt .pic-5,
.book-ct .pic-5,
.book-rt .pic-5 {
  background-position: -292px 0px;
  width: 74px;
  height: 74px;
}
.activeB {
  box-shadow: 0 0 30px 14px #f2f2f2;
}
.hand-bg {
  background: url('/images/hand-bg.jpg') no-repeat center center;
}
.hand-box .h-icon {
  background-image: url("/images/h-icon.png");
  display: block;
  margin: 0 auto;
}
.hand-box .pic-1 {
  background-position: 0px 0px;
  width: 71px;
  height: 76px;
}
.hand-box .pic-2 {
  background-position: -71px 0px;
  width: 74px;
  height: 61px;
}
.hand-box .pic-3 {
  background-position: -145px 0px;
  width: 76px;
  height: 66px;
}
.hand-box .pic-4 {
  background-position: -221px 0px;
  width: 69px;
  height: 73px;
}
.hand-box .pic-5 {
  background-position: -290px 0px;
  width: 76px;
  height: 63px;
}
.hand-box .pic-8 {
  background-position: -145px -80px;
  width: 76px;
  height: 60px;
}
.hand-box .pic-7 {
  background-position: -80px -75px;
  width: 60px;
  height: 76px;
}
.hand-box .pic-6 {
  background-position: 0px -80px;
  width: 74px;
  height: 74px;
}
.hand-box .pic-w {
  width: 66px;
}
.sf-ct {
  margin-top: 35px;
  margin-bottom: 25px;
  font-size: 18px;
  color: #323232;
}
.line-w {
  background: url("/images/line.png") no-repeat center center;
  width: 100%;
  height: 86px;
  margin-top: -80px;
}
.sf-list {
  overflow: hidden;
  padding-bottom: 40px;
}
.sf-list ul {
  float: left;
  font-size: 14px;
  color: #747474;
  cursor: pointer;
}
.sf-list li {
  float: left;
  width: 80px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  background: #F2F2F2;
  margin-right: 10px;
}
.sf-list .sf-active {
  background: #E40000;
  color: #ffffff;
}
.load-box {
  overflow: hidden;
  margin-top: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid #cccccc;
}
.load-box .load-lt,
.load-box .load-ct,
.load-box .load-rt {
  float: left;
}
.load-box .load-lt {
  width: 55%;
}
.load-box .load-lt .load-icon {
  background: url("/images/load.png") no-repeat;
  display: inline-block;
  width: 16px;
  height: 15px;
  vertical-align: middle;
  margin-right: 8px;
}
.load-box .load-lt span {
  vertical-align: middle;
}
.load-box .load-lt .up {
  font-size: 14px;
  color: #323232;
  margin-bottom: 5px;
}
.load-box .load-lt .down {
  font-size: 14px;
  color: #909090;
}
.load-box .load-ct {
  width: 30%;
}
.load-box .load-ct .sc-time {
  color: #666666;
  margin-bottom: 5px;
}
.load-box .load-ct .load-num {
  color: #666666;
}
.load-box .load-rt {
  width: 15%;
}
.load-box .load-rt span {
  display: inline-block;
  width: 100px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border: 1px solid #E5E5E5;
  font-size: 14px;
  color: #e40000;
  cursor: pointer;
}
.sf-alert {
  position: absolute;
  height: 100%;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.2);
  z-index: 9999;
}
.sf-alert .sf-box {
  width: 1000px;
  height: 600px;
  background: #ffffff;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -500px;
  margin-top: -414px;
  font-size: 18px;
  padding: 20px 0;
  overflow: hidden;
  overflow-y: scroll;
}
.sf-alert .sf-line {
  border-bottom: 1px solid #dcdcdc;
  padding-bottom: 20px;
}
.sf-alert .sf-t {
  overflow: hidden;
}
.sf-alert .sf-t .sf-left {
  float: left;
  width: 85%;
  text-align: center;
}
.sf-alert .sf-t .sf-left h1 {
  font-size: 16px;
  color: #323232;
  margin-bottom: 5px;
  text-align: center;
}
.sf-alert .sf-t .sf-left h1 a {
  font-size: 14px;
  color: #ffffff;
  display: inline-block;
  width: 55px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  background: #E40000;
}
.sf-alert .sf-t img {
  float: right;
  margin-right: 10px;
  cursor: pointer;
}
.sf-cot {
  padding: 20px 120px 20px 140px;
}
.sf-cot .jf,
.sf-cot .yf {
  font-size: 14px;
  color: #666666;
}
.sf-cot .yf {
  margin-bottom: 30px;
}
.sf-cot .sf-title {
  margin-top: 30px;
  margin-bottom: 20px;
}
.sf-cot h3 {
  font-size: 14px;
  color: #666666;
}
.sf-cot p {
  font-size: 14px;
  color: #949494;
  margin-bottom: 30px;
}
.gw-bg {
  background: url("/images/gw-bg.jpg") no-repeat;
  width: 100%;
  height: 360px;
}
.gw-bg .ct h2 {
  font-size: 46px;
}
.gw-title {
  margin-top: 60px;
  margin-bottom: 40px;
  text-align: center;
}
.gw-title h2 {
  font-size: 26px;
  color: #323232;
}
.gw-title h3 {
  font-size: 18px;
  color: #909090;
}
.gw-table {
  text-align: center;
  border: 1px solid #DCDCDC;
  margin-bottom: 40px;
  width: 1100px;
}
.gw-table thead {
  font-size: 18px;
  color: #323232;
}
.gw-table tbody {
  font-size: 16px;
  color: #323232;
}
.gw-table tbody td {
  padding-top: 10px;
  padding-bottom: 10px;
}
.gw-table .td-1 {
  width: 185px;
}
.gw-table .td-2 {
  width: 185px;
}
.gw-table .td-3 {
  width: 720px;
}
.gw-table tr {
  height: 70px;
}
.gw-table .bg-blue {
  background-color: #0F77E9;
  font-size: 16px;
  color: #ffffff;
}
.gw-table .bg-green {
  background: #8CC253;
  font-size: 16px;
  color: #ffffff;
}
.gw-table .two-bg {
  background: #F2F8FF;
  font-size: 16px;
  color: #323232;
}
.gw-table .td-f {
  font-size: 16px;
  color: #666666;
  text-align: left;
  padding-left: 50px;
  padding-right: 30px;
}
.gw-table .activeTr {
  background: #F8F8F8;
}
.hz-ways {
  width: 1100px;
  margin-bottom: 50px;
}
.hz-ways h2 {
  font-size: 18px;
  color: #ffffff;
  background: #E40000;
  height: 50px;
  line-height: 50px;
  text-align: center;
}
.hz-ways .gw-cot {
  border: 1px solid #dcdcdc;
  padding: 15px 55px 25px 45px;
}
.hz-ways .gw-cot p {
  font-size: 14px;
  color: #666666;
  margin-bottom: 10px;
}
.sever-wrap {
  background: url("/images/gw-bg2.jpg") no-repeat center;
  width: 100%;
  height: 540px;
}
.sever-wrap h2 {
  padding-top: 70px;
  text-align: center;
  font-size: 30px;
  color: #ffffff;
}
.sever-wrap h3 {
  font-size: 18px;
  color: #ffffff;
  text-align: center;
}
.sever-wrap ul,
.sever-wrap li {
  float: left;
}
.sever-wrap ul {
  width: 100%;
  margin-top: 70px;
}
.sever-wrap li {
  margin-right: 40px;
  text-align: center;
}
.sever-wrap img {
  margin-bottom: 20px;
  vertical-align: middle;
}
.sever-wrap .jt {
  padding-left: 40px;
}
.sever-wrap h4 {
  font-size: 20px;
  border-top: 2px solid red;
  color: #ffffff;
  padding-top: 5px;
  width: 90px;
  margin-left: 11px;
}
.sever-ts {
  width: 100%;
  height: 500px;
  background-color: #ffffff;
}
.sever-ts h2 {
  padding-top: 70px;
  text-align: center;
  font-size: 28px;
  color: #323232;
}
.sever-ts h3 {
  font-size: 18px;
  color: #909090;
  text-align: center;
}
.sever-ts .sev-cot {
  overflow: hidden;
  margin-top: 80px;
}
.sever-ts .sev-cot h3 {
  font-size: 24px;
  color: #323232;
  margin-top: 30px;
}
.sever-ts .sev-cot .ts-ct h3 {
  margin-top: 40px;
}
.sever-ts .sev-cot .ts-lt h3 {
  margin-top: 42px;
}
.sever-ts .sev-cot h4 {
  font-size: 16px;
  color: #909090;
}
.sever-ts .ts-lt,
.sever-ts .ts-ct,
.sever-ts .ts-rt {
  float: left;
  width: 33%;
  text-align: center;
}
/*base code*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}
/*the animation definition*/
@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -ms-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -ms-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    -ms-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    -ms-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  100% {
    -webkit-transform: perspective(400px);
    -ms-transform: perspective(400px);
    transform: perspective(400px);
  }
}
.flipInX {
  -webkit-backface-visibility: visible!important;
  -ms-backface-visibility: visible!important;
  backface-visibility: visible!important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}
.sev-icon {
  background-image: url("/images/gw-icon.png");
  display: block;
  margin: 0 auto;
  cursor: pointer;
}
.zy {
  background-position: -300px -65px;
  width: 66px;
  height: 49px;
}
.gx {
  background-position: -225px -65px;
  width: 66px;
  height: 54px;
}
.pj {
  background-position: -125px -65px;
  width: 66px;
  height: 66px;
}
.pic-1 {
  background-position: 0px 0px;
  width: 68px;
  height: 47px;
}
.pic-fa{
  background: url("/images/gw-pic.png") no-repeat center;
  width: 60px;
  height: 42px;
}
.pic-2 {
  background-position: -68px 0px;
  width: 60px;
  height: 52px;
}
.pic-3 {
  background-position: -128px 0px;
  width: 60px;
  height: 45px;
}
.pic-4 {
  background-position: -188px 0px;
  width: 48px;
  height: 58px;
}
.pic-5 {
  background-position: -236px 0px;
  width: 57px;
  height: 56px;
}
.pic-6 {
  background-position: -293px 0px;
  width: 55px;
  height: 60px;
}
.pic-7 {
  background: url("/images/pic-7.png") no-repeat;
  width: 70px;
  height: 63px;
}
.pic-8 {
  background-position: 0px -56px;
  width: 43px;
  height: 55px;
}
.pic-9 {
  background-position: -43px -56px;
  width: 56px;
  height: 47px;
}
.need-wrap {
  width: 100%;
  background: #F6F6F6;
  padding-bottom: 55px;
}
.need-cot {
  overflow: hidden;
}
.need-cot .sev-icon {
  margin-top: 120px;
}
.need-cot h2 {
  padding-top: 70px;
  text-align: center;
  font-size: 28px;
  color: #323232;
}
.need-cot h3 {
  font-size: 18px;
  color: #909090;
  text-align: center;
}
.need-cot h4 {
  text-align: center;
  margin-top: 10px;
  font-size: 20px;
  color: #ffffff;
}
.need-cot .need-lt,
.need-cot .need-ct,
.need-cot .need-rt {
  float: left;
  width: 300px;
  height: 300px;
  transition: transform .3s linear;
  cursor: pointer;
}
.need-cot .sev-box {
  width: 990px;
  height: 300px;
  padding: 10px;
  margin: 30px auto 0 auto;
}
.need-cot .sev-1 {
  background: #67D3B6;
  margin-right: 40px;
}
.need-cot .sev-2 {
  background: #9458FD;
  margin-right: 40px;
}
.need-cot .sev-3 {
  background: #00BEC0;
}
.need-cot .sev-4 {
  background: #A8A9FC;
  margin-right: 40px;
}
.mr40{
  margin-right: 40px;
}
.need-cot .sev-5 {
  background: #F6BB43;
  margin-right: 40px;
}
.need-cot .mr0{
  margin-right: 0;
}
.need-cot .sev-6 {
  background: #0F77E9;
}
.need-cot .sev-7 {
  background: #76CA00;
  margin-right: 40px;
}
.need-cot .sev-8 {
  background: #A8C6E7;
  margin-right: 40px;
}
.need-cot .mr0{
  margin-right: 0;
}
.need-cot .sev-9 {
  background: #FF9700;
}
.need-cot .bgColor{
  background: #3BAEDA;
}
.need-cot .bgColor2{
  background: #9458FD;
}
.need-cot .bgColor3{
  background: #00BEC0;
}
.need-cot .activeSev {
  box-shadow: 1px 1px 20px 6px #D7D7D7;
}
.make-sev {
  background: #ffffff;
  width: 100%;
}
.make-sev .make-box {
  overflow: hidden;
  width: 990px;
  margin-bottom: 60px;
}
.make-sev .make-lt,
.make-sev .make-rt {
  float: left;
  width: 50%;
  margin-top: 80px;
}
.make-sev .make-lt h1 {
  font-size: 28px;
  color: #323232;
}
.make-sev .make-lt h2 {
  font-size: 18px;
  color: #909090;
}
.make-sev .zx-box {
  margin-top: 30px;
  padding-bottom: 70px;
  overflow: hidden;
}
.make-sev .dl-lt,
.make-sev .zx-rt {
  float: left;
  width: 50%;
}
.make-sev .dl-lt img,
.make-sev .zx-rt img,
.make-sev .dl-lt span,
.make-sev .zx-rt span {
  vertical-align: middle;
  cursor: pointer;
}
.make-sev .dl-lt span,
.make-sev .zx-rt span {
  font-size: 14px;
  color: #909090;
  margin-left: 7px;
}
.make-sev .intro {
  padding-bottom: 100px;
}
.make-sev .intro h3 {
  font-size: 18px;
  color: #232323;
  margin-bottom: 25px;
}
.make-sev .intro h4 {
  font-size: 14px;
  color: #B4B4B4;
  margin-bottom: 10px;
}
.make-sev .make-rt {
  background: #F8F8F8;
  width: 487px;
}
.make-sev .make-cot {
  padding: 35px 100px 70px 55px;
  width: 340px;
}
.make-sev .b-line {
  border-bottom: 1px solid #e7e4e4;
  padding-top: 15px;
  padding-bottom: 15px;
}
.make-sev .b-line span {
  font-size: 14px;
  color: #909090;
}
.make-sev .b-line input {
  outline: medium;
  border: none;
  background: #F8F8F8;
  font-size: 14px;
  padding-left: 5px;
  margin-top: -2px;
  width: 300px;
  height: 30px;
  line-height: 30px;
}
.make-sev .b-line textarea {
  width: 328px;
  resize: none;
  height: 85px;
  border: none;
  vertical-align: middle;
  padding: 5px;
  padding-bottom: 0;
  font-size: 14px;
  margin-top: 10px;
  background-color: #f8f8f8;
  outline: medium;
}
.make-sev .pt-t {
  margin-top: 20px;
  width: 340px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background-color: #E40000;
  cursor: pointer;
}
.make-sev .pt-t span {
  font-size: 16px;
  color: #ffffff;
}
.make-sev .pt-t:hover {
  background-color: #da0202;
}
.zy-bg {
  background: url("/images/zy-bg.jpg") no-repeat center;
}
.gp-bg {
  background: url("/images/gp-bg.jpg") no-repeat center;
}
.gq-bg {
  background: url("/images/gq-bg.jpg") no-repeat center;
}
.zq-bg {
  background: url("/images/zq-bg.jpg") no-repeat center;
}
.zc-bg {
  background: url("/images/zc-bg.jpg") no-repeat center;
}
.wy-bg {
  background: url("/images/wy-bg.jpg") no-repeat center;
}
.bx-bg {
  background: url("/images/bx-bg.jpg") no-repeat center;
}
.sr-bg {
  background: url("/images/sr-bg.jpg") no-repeat center;
}
.per-bg {
  background: url("/images/per-bg.jpg") no-repeat center;
}