﻿.middle {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
} 
 
#menu {
  overflow: hidden;
  height: 100%;
  float: right;
  width:18%;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#menu #ensconce {
  /*隐藏菜单样式*/
  width: 100%;
  height: 100%;
  background-color: #20343c;
  float: right;
  text-align: center;
  position: relative;
  display: none;
  min-height: 650px;
}
#menu #ensconce h2 {
  cursor: pointer;
  color: #fff;
  font-size: 0.24rem;
  line-height: 0.5rem;
  width: 100%;
  position: relative;
  top: 30%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(0%, -50%);
}
#menu #ensconce h2 img {
  width: 52%;
}
#menu #open {
  /*显示菜单样式*/
  width: 2.6rem;
  height: 100%;
  background-color: #363a45;
  /* padding-bottom: 0.1rem; */
  box-sizing: border-box;
  -webkit-transition: all 0.8s ease;
  -moz-transition: all 0.8s ease;
  -o-transition: all 0.8s ease;
  -ms-transition: all 0.8s ease;
}
#menu #open .navH {
  height: 0.6rem;
  background-color: #44495a;
  line-height: 0.6rem;
  text-align: center;
  font-size: 0.2rem;
  color: #fff;
  position: relative;
  box-sizing: border-box;
}
#menu #open .navH span {
  position: absolute;
  top: 49%;
  right: 0;
  padding: 0 0.15rem;
  cursor: pointer;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  display: inline-block;
}
#menu #open .navH span .obscure {
  width: 0.24rem;
}
#menu #open .navBox {
  height: 100%;
  overflow-y: auto;
  padding-left: 0.05rem;
  padding-right: 0.07rem;
  margin-top: 0.1rem;
}
#menu #open .navBox ul li {
  background-color: #393c4a;
  cursor: pointer;
  margin-bottom: 4px;
}
#menu #open .navBox ul li .obtain {
  background-color: #3889D4; 
}
#menu #open .navBox ul li .obtain:hover {
  background-color: #3D8332; 
}
#menu #open .navBox ul li h2 {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #fff;
  font-size: 0.15rem;
  padding: 0.15rem 0;
  -webkit-transition: all 0.6s ease;
  -moz-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
}
#menu #open .navBox ul li h2 i {
  position: absolute;
  top: 50%;
  right: 0.15rem;
  border-top: 0.07rem transparent dashed;
  border-left: 0.07rem solid #fff;
  border-right: 0.07rem transparent dashed;
  border-bottom: 0.07rem transparent dashed;
  display: inline-block;
  -webkit-transition: -webkit-transform 0.6s ease;
  -moz-transition: -moz-transform 0.6s ease;
  -o-transition: -o-transform 0.6s ease;
  -ms-transition: -ms-transform 0.6s ease;
  transform-origin: 4px 3px;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}
#menu #open .navBox ul li h2 .arrowRot {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
#menu #open .navBox ul li .secondary {
  overflow: hidden;
  height: 0;
  -webkit-transition: all 0.6s ease;
  -moz-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
}
#menu #open .navBox ul li .secondary h3 {
  padding: 0.1rem 0;
    text-align: center;
    font-size: 0.13rem;
    background-color: #282c3a;
    color: #ffffff;
    border-bottom: 0.8px solid #42495d;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
}
#menu #open .navBox ul li .secondary h3:hover {
  background-color: #1acbfc;
}
#menu #open .navBox ul li .secondary .seconFocus {
  background-color: #1acbfc;
  -webkit-box-shadow: 3px 3px 3px #aa8c51;
  -moz-box-shadow: 3px 3px 3px #aa8c51;
  box-shadow: 3px 3px 3px #aa8c51;
}
/* =========================================== */
.content-wrapper .content {
    margin-top: -10px!important;
}
section{width:100%; float:right;}
.common-info{ width:80%; float:left}
.content-wrapper .J_mainContent .J_iframe.homePage .common-info{ margin-top:-0px; }
#tabs {
  overflow: hidden;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
#tabs li {
  float: left;
  margin: 0 .5em 0 0;
}
#tabs a {
  position: relative;
  background: #ddd;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ddd));
  background-image: -webkit-linear-gradient(top, #fff, #ddd);
  background-image: -moz-linear-gradient(top, #fff, #ddd);
  background-image: -ms-linear-gradient(top, #fff, #ddd);
  background-image: -o-linear-gradient(top, #fff, #ddd);
  background-image: linear-gradient(to bottom, #fff, #ddd);
  padding: .5em 1em;
  float: left;
  text-decoration: none;
  color: #444;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
  -webkit-border-radius: 5px 0 0 0;
  -moz-border-radius: 5px 0 0 0;
  border-radius: 5px 0 0 0;
  -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, .4);
  -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, .4);
  box-shadow: 0 2px 2px rgba(0, 0, 0, .4);
}
 #tabs a:hover, #tabs a:hover::after, #tabs a:focus, #tabs a:focus::after {
 background: #fff;
}
#tabs a:focus {
  outline: 0;
}
 #tabs a::after {
 content:'';
 position:absolute;
 z-index: 1;
 top: 0;
 right: -.5em;
 bottom: 0;
 width: 1em;
 background: #ddd;
 background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ddd));
 background-image: -webkit-linear-gradient(top, #fff, #ddd);
 background-image: -moz-linear-gradient(top, #fff, #ddd);
 background-image: -ms-linear-gradient(top, #fff, #ddd);
 background-image: -o-linear-gradient(top, #fff, #ddd);
 background-image: linear-gradient(to bottom, #fff, #ddd);
 -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, .4);
 -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, .4);
 box-shadow: 2px 2px 2px rgba(0, 0, 0, .4);
 -webkit-transform: skew(10deg);
 -moz-transform: skew(10deg);
 -ms-transform: skew(10deg);
 -o-transform: skew(10deg);
 transform: skew(10deg);
 -webkit-border-radius: 0 5px 0 0;
 -moz-border-radius: 0 5px 0 0;
 border-radius: 0 5px 0 0;
}
 #tabs #current a, #tabs #current a::after {
 background: #fff;
 z-index: 3;
}
#content {
  background: #fff;
  padding: 2em;
  /*height: 600px;*/
  height: 100%;
  display: inline-block;
  position: relative;
  z-index: 2;
  -moz-border-radius: 0 5px 5px 5px;
  -webkit-border-radius: 0 5px 5px 5px;
  border-radius: 0 5px 5px 5px;
  -moz-box-shadow: 0 -2px 3px -2px rgba(0, 0, 0, .5);
  -webkit-box-shadow: 0 -2px 3px -2px rgba(0, 0, 0, .5);
  box-shadow: 0 -2px 3px -2px rgba(0, 0, 0, .5);
}
#content h2, #content h3, #content p {
  margin: 0 0 15px 0;
}
#about {
  color: #999;
}
#about a {
  color: #eee;
}
.content-wrapper .J_mainContent .J_iframe.homePage .common-info ul.first-title {
    /*min-height: 80%;*/
    margin-bottom: 20px;
    float: left!important;
}
/* 右侧导航部分 */
body .container {
  width: 100%;
  font-size: 1.2em;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 6px 6px 24px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  /*margin:30px auto;*/
}
body .container .box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 60px;
  padding: 0px 20px;
  transition: all 0.3s;
  color: white;
  text-decoration: none;
      position: relative!important;
    top: -20px!important;
        margin-bottom: 0px!important;
}
body .container .box.box1 {
  background-color: #7986CB;
}
body .container .box.box2 {
  background-color: #FF8A65;
}
body .container .box.box3 {
  background-color: #F06292;
}
body .container .box.box4 {
  background-color: #4DB6AC;
}
body .container .box.box5 {
  background-color: #337ab7;
}
body .container .box.box6{
  background-color: #b64d4d;
}
body .container .box.box7{
  background-color: #2b528c;
}
body .container .box.box8{
  background-color: #ec9150;
}
body .container .box .name {
  width: 80px;
}
body .container .box .name .fours, body .container .box .name h5 {
  font-weight: 300;
}
body .container .box .name h5 {
  font-size: 0em;
  line-height: 1.5;
}
body .container .box p {
  font-size: 0.8em;
  font-weight: 300;
}
body .container .box:before {
  content: "";
  height: 0px;
  width: 0px;
  border: 2px solid white;
  border-radius: 50%;
  margin-left: -50%;
  background-color: white;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.titles{padding-bottom: 20px;  text-align: center;    font-size: 18px; font-weight: bold;}
.content-wrapper .J_mainContent .J_iframe.homePage .common-info ul.first-title > li {
    margin-right: 19px!important;
}
.tips{width: 100%;display: inline-block;}
.tips .fours,.tips h5 {
    font-weight: 500;
}
.tips h5 {
    font-size: 0em;
    line-height: 1.5;
    font-weight: 400;
    color:#fff;
}
.tps {
    font-size: 0.8em;
    font-weight: 400;
    right: 20;
    width:10%;margin-left: 20px; margin-top:5px;float:left;
}
.biao{
    color:#fff;
    position: relative;
    top: 25px;
    z-index: 100;
    width:100%;
}
 body .container {
   position: relative;
   /*top: -10px;*/
   margin-bottom: 50px;
}
.tds{width:65%;margin-left: 20px;float:left;}
.content-wrapper .J_mainContent .J_iframe.homePage {
    /*max-height: 650px!important;*/
    overflow: hidden;
    overflow-y: scroll;
}