@charset "UTF-8";

/**
 *
 * @authors Your Name (you@example.org)
 * @date    2016-10-27 10:04:32
 * @version $Id$
 */
.i-box01 { background-color: #fafafa; padding-bottom: 65px; }
.subtitle { padding: 30px 0 20px 0; text-align: center; }
.subtitle .item { color: #333; }
.subtitle .item .eng02 { font-size: 12px; color: #999; }
.subtitle .item .cn { font-size: 32px; padding: 10px 0 10px 0; color: #333; }
.subtitle .item span { display: inline-block; width: 2em; height: 1px; background-color: #494949; vertical-align: middle; margin: 0 10px; }
.subtitle .item b { color: #4d6cc3; font-weight: normal; }
.i-box01 ul { margin: 40px 0; }
.i-box01 ul li { float: left; border-right: 1px solid #eaeaea; text-align: center; padding-right: 26px; margin-right: 26px; color: #333; }
.i-box01 ul li .o-pic { margin-bottom: 30px; }
.i-box01 ul li .name { font-size: 16px; margin-bottom: 10px; }
.i-box01 ul li .line { width: 100%; height: 10px; margin: 0 auto; margin-top: 20px; background-color: #eaeaea; }
.i-box01 ul li .line span { display: inline-block; width: 0%; height: 10px; background-color: #64b5bf; float: left; z-index: 9999; transition: All 0.4s ease-in-out; -webkit-transition: All 0.4s ease-in-out; -moz-transition: All 0.4s ease-in-out; -o-transition: All 0.4s ease-in-out; opacity: 0.5; }
.i-box01 ul li:hover .line span { width: 100%; opacity: 1 }
.i-box02 { background: url(../images/bg.jpg) no-repeat; background-size: cover; padding-bottom: 65px; }
.bigPic { float: left; position: relative; width: 40%; max-width: 473px; }
.bigPic .item { position: relative; overflow: hidden; }
.bigPic .item>img { width: 100%; }
.bigPic .item .words { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.45); color: #fff; font-size: 14px; padding: 165px 30px; line-height: 28px; }
.bigPic .item .words .title { font-size: 20px; margin-bottom: 20px; }
.smallPic { float: left; width: 60%; }
.smallPic .item { position: relative; float: left; width: 49%; max-width: 356px; overflow: hidden; margin: 0 0 1.5% 1%; }
.smallPic .item.bottomPic { margin: 0 0 0% 1%; }
.smallPic .item img { width: 100%; }
.smallPic .item .title { position: absolute; bottom: 0px; left: 0px; width: 100%; height: 30px; line-height: 30px; background-color: rgba(0, 0, 0, 0.45); color: #fff; font-size: 14px; padding: 0px 25px; }
.i-box03 { padding-bottom: 65px; background-color: #fafafa }
.prd-tab { border-bottom: 1px solid #248595; display: flex; }
.prd-tab .item { color: #333; font-size: 16px; text-align: center; padding: 10px 20px; width: 19.7%; background-color: #fff; display: inline-block; }
.prd-tab .item.active { border: 1px solid #248595; border-bottom: 1px solid #fff; margin-bottom: -1px; }
.swiper-container { width: 100%; height: 100%; }
.swiper-slide { text-align: center; font-size: 18px; background: #fff;    /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.swiper-slide img { width: 100%; }

/*响应式设置*/
@media screen and (min-width:1025px) and (max-width:1200px) { }
@media screen and (min-width:769px) and (max-width:1024px) {
  .i-box01 { padding-bottom: 20px; }
  .subtitle { padding: 10px 0 10px 0 }
  .subtitle .item .cn { font-size: 16px; padding: 5px 0 5px 0; }
  .i-box01 ul { margin: 20px 0; }
  .i-box01 ul li { width: 48%; margin: 0 1%; padding: 0 5px; border: none; font-size: 12px; margin-bottom: 20px; }
  .i-box01 ul li .o-pic { margin-bottom: 10px; }
  .i-box01 ul li .o-pic img { width: 100%; }
  .i-box01 ul li .name { font-size: 14px; margin-bottom: 5px; }
  .i-box01 ul li .line { margin-top: 5px; }
  .i-box02 { padding-bottom: 20px; }
  .bigPic { width: 100%; max-width: none; padding: 0 1%; float: none; }
  .bigPic .item .words { padding: 50px 20px; }
  .bigPic .item .words .title { font-size: 18px; }
  .smallPic { width: 100%; }
  .smallPic .item { width: 48%; margin: 1%; max-width: none; }
  .smallPic .item .title { }
  .smallPic .item.bottomPic { margin: 1%; }
  .prd-tab { display: block; border-bottom: none; margin-bottom: 10px; }
  .prd-tab .item { font-size: 14px; padding: 5px; width: 48%; float: left; margin: 1%; }
  .prd-tab .item.active { margin-bottom: auto; border-bottom: 1px solid #248595; }
  .i-box03 { padding-bottom: 20px; }
}
@media screen and (min-width:641px) and (max-width:768px) {
  .i-box01 { padding-bottom: 20px; }
  .subtitle { padding: 10px 0 10px 0 }
  .subtitle .item .cn { font-size: 16px; padding: 5px 0 5px 0; }
  .i-box01 ul { margin: 20px 0; }
  .i-box01 ul li { width: 48%; margin: 0 1%; padding: 0 5px; border: none; font-size: 12px; margin-bottom: 20px; }
  .i-box01 ul li .o-pic { margin-bottom: 10px; }
  .i-box01 ul li .o-pic img { width: 100%; }
  .i-box01 ul li .name { font-size: 14px; margin-bottom: 5px; }
  .i-box01 ul li .line { margin-top: 5px; }
  .i-box02 { padding-bottom: 20px; }
  .bigPic { width: 100%; max-width: none; padding: 0 1%; float: none; }
  .bigPic .item .words { padding: 50px 20px; }
  .bigPic .item .words .title { font-size: 18px; }
  .smallPic { width: 100%; }
  .smallPic .item { width: 48%; margin: 1%; max-width: none; }
  .smallPic .item .title { }
  .smallPic .item.bottomPic { margin: 1%; }
  .prd-tab { display: block; border-bottom: none; margin-bottom: 10px; }
  .prd-tab .item { font-size: 14px; padding: 5px; width: 48%; float: left; margin: 1%; }
  .prd-tab .item.active { margin-bottom: auto; border-bottom: 1px solid #248595; }
  .i-box03 { padding-bottom: 20px; }
}
@media screen and (min-width:321px) and (max-width:640px) {
  .i-box01 { padding-bottom: 20px; }
  .subtitle { padding: 10px 0 10px 0 }
  .subtitle .item .cn { font-size: 16px; padding: 5px 0 5px 0; }
  .i-box01 ul { margin: 20px 0; }
  .i-box01 ul li { width: 48%; margin: 0 1%; padding: 0 5px; border: none; font-size: 12px; margin-bottom: 20px; }
  .i-box01 ul li .o-pic { margin-bottom: 10px; }
  .i-box01 ul li .o-pic img { width: 100%; }
  .i-box01 ul li .name { font-size: 14px; margin-bottom: 5px; }
  .i-box01 ul li .line { margin-top: 5px; }
  .i-box02 { padding-bottom: 20px; }
  .bigPic { width: 100%; max-width: none; padding: 0 1%; float: none; }
  .bigPic .item .words { padding: 50px 20px; }
  .bigPic .item .words .title { font-size: 18px; }
  .smallPic { width: 100%; }
  .smallPic .item { width: 48%; margin: 1%; max-width: none; }
  .smallPic .item .title { }
  .smallPic .item.bottomPic { margin: 1%; }
  .prd-tab { display: block; border-bottom: none; margin-bottom: 10px; }
  .prd-tab .item { font-size: 14px; padding: 5px; width: 48%; float: left; margin: 1%; }
  .prd-tab .item.active { margin-bottom: auto; border-bottom: 1px solid #248595; }
  .i-box03 { padding-bottom: 20px; }
}
@media screen and (max-width:320px) {
  .i-box01 { padding-bottom: 20px; }
  .subtitle { padding: 10px 0 10px 0 }
  .subtitle .item .cn { font-size: 16px; padding: 5px 0 5px 0; }
  .i-box01 ul { margin: 20px 0; }
  .i-box01 ul li { width: 48%; margin: 0 1%; padding: 0 5px; border: none; font-size: 12px; margin-bottom: 20px; }
  .i-box01 ul li .o-pic { margin-bottom: 10px; }
  .i-box01 ul li .o-pic img { width: 100%; }
  .i-box01 ul li .name { font-size: 14px; margin-bottom: 5px; }
  .i-box01 ul li .line { margin-top: 5px; }
  .i-box02 { padding-bottom: 20px; }
  .bigPic { width: 100%; max-width: none; padding: 0 1%; float: none; }
  .bigPic .item .words { padding: 50px 20px; }
  .bigPic .item .words .title { font-size: 18px; }
  .smallPic { width: 100%; }
  .smallPic .item { width: 48%; margin: 1%; max-width: none; }
  .smallPic .item .title { }
  .smallPic .item.bottomPic { margin: 1%; }
  .prd-tab { display: block; border-bottom: none; margin-bottom: 10px; }
  .prd-tab .item { font-size: 14px; padding: 5px; width: 48%; float: left; margin: 1%; }
  .prd-tab .item.active { margin-bottom: auto; border-bottom: 1px solid #248595; }
  .i-box03 { padding-bottom: 20px; }
}