/*=========================================================
 . topic 
=========================================================*/
.article {
  background: #FFF;
  padding-bottom: 25px; }
  .article .topicPath {
    margin: 0;
    padding: 10px 25px;
    background: #DEE2E5;
    color: #757575;
    font-size: 11px; }
  .article .categoryHead .topicPath + h2 {
    background: none;
    margin: 10px 0; }
  .article .pageselect {
    margin-bottom: 10px; }

.banner_main {
  text-align: center;
  margin: 20px auto; }

.borderTop {
  border-bottom: 1px dotted gray;
  margin: 0 20px; }

.link_official {
  margin: 5px 50px;
  float: right; }

table#topic_head {
  background: #DEE2E5;
  height: 105px;
  width: 100%;
  margin-bottom: 8px; }
  table#topic_head td.img {
    max-width: 100px; }
    table#topic_head td.img img {
      padding: 5px; }
  table#topic_head h1 {
    margin: 0 0 0 20px;
    line-height: 1.4; }
  table#topic_head ul {
    margin: 0;
    padding: 0;
    list-style: none; }
  table#topic_head li {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 10pt; }
  table#topic_head td ul li a {
    color: #006699 !important; }
    table#topic_head td ul li a:link {
      color: #006699 !important; }

div#topic_desc {
  padding: 5px;
  font-size: 11pt;
  margin-bottom: 5px; }

ul#topicNewsList {
  display: block;
  padding: 0 20px; }
  ul#topicNewsList li {
    display: block;
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px dotted gray; }
    ul#topicNewsList li img {
      float: left;
      border: 1px solid #d7d7d7;
      padding: 0; }
    ul#topicNewsList li p.newsText {
      padding: 0 0 0 120px;
      margin: 0;
      font-size: 90%; }
    ul#topicNewsList li .mini_gray {
      font-size: 77%;
      color: #666; }
    ul#topicNewsList li a {
      font-weight: bold;
      color: #444;
      font-size: 105%;
      text-decoration: none; }
      ul#topicNewsList li a:active, ul#topicNewsList li a:hover {
        color: #0000ff;
        text-decoration: underline; }

.outline {
  clear: both;
  font-weight: bold;
  margin: 0 20px;
  padding: 0px 0 20px 0; }

.officilSite {
  background-color: #e8e8e8; }
  .officilSite p {
    padding: 5px 10px 0px 0;
    text-align: right;
    font-size: 14px;
    color: #003366;
    margin: 0; }
    .officilSite p.studioaLink {
      padding: 0 10px 5px 0;
      text-align: right; }

div#communityList {
  margin-left: 1em;
  width: 170px;
  padding: 4px;
  float: right;
  background-color: #e7f7ff; }
  div#communityList h3 {
    background-image: url(/image/news/topic/community_title.gif);
    width: 170px;
    height: 81px;
    text-indent: -1000px;
    overflow: hidden; }
  div#communityList ul li {
    border-bottom: 1px solid #888888;
    font-size: 9pt; }
    div#communityList ul li span.date {
      color: gray;
      display: block; }
    div#communityList ul li span.title {
      display: block;
      font-size: 10pt;
      font-weight: bold; }
    div#communityList ul li span.author {
      color: #4a95ba;
      display: block; }
      div#communityList ul li span.author label {
        color: gray; }
  div#communityList .link {
    background-color: #d2edff;
    margin: 5px 0;
    padding: 5px;
    font-size: 9pt;
    font-weight: bold;
    line-height: 1.2em; }
    div#communityList .link a {
      color: #002469; }
div#toptopic {
  position: relative;
  padding-top: 10px; }
  div#toptopic h3 {
    text-indent: -1000px;
    background-image: url(/image/topic/toptopic.gif);
    height: 28px; }
div#toptopics {
  padding: 19px 0px 0px 23px;
  background-color: #ccc;
  width: 610px;
  overflow: hidden; }
  div#toptopics ul {
    display: block;
    margin: 0;
    padding: 0;
    width: 630px; }
    div#toptopics ul li {
      display: block;
      margin: 0;
      padding: 0;
      width: 160px;
      height: 135px;
      float: left;
      margin-right: 24px;
      margin-bottom: 17px;
      background-color: white;
      padding: 10px;
      font-size: 9pt;
      font-weight: bold; }
      div#toptopics ul li img {
        width: auto;
        height: 110px;
        display: block;
        margin: 0 auto; }
div#matrix {
  background-image: url("/image/topic/select.png");
  height: 540px;
  position: relative;
  margin: 0 50px 50px; }
  div#matrix h3, div#matrix h4 {
    display: none; }
  div#matrix a {
    display: block;
    position: absolute;
    width: 36px;
    height: 36px;
    text-indent: -500px;
    overflow: hidden; }
    div#matrix a:hover, div#matrix a:active {
      background-color: white;
      opacity: 0.6; }

ul#topicList {
  font-size: 11pt; }
  ul#topicList li {
    margin: 0 0 14px 10px;
    width: 200px;
    float: left; }
    ul#topicList li span.mini_gray {
      font-size: 82%; }

/* for smartphone */
div#communityList.sp {
  margin-left: 0;
  width: 100%;
  padding: 4px;
  float: none;
  background-color: #e7f7ff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  div#communityList.sp h3 {
    padding: 5px;
    background-image: none;
    background-color: #D2EDFF;
    color: #002469;
    width: auto;
    height: auto;
    text-indent: 0;
    font-weight: bold;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: solid 2px #002469; }
    div#communityList.sp h3 span {
      display: block;
      font-size: 14px; }
  div#communityList.sp .link {
    background-color: #d2edff;
    margin: 5px 0;
    padding: 10px;
    font-size: 9pt;
    font-weight: bold;
    text-align: center;
    line-height: 1.2em; }

@media screen and (max-width: 768px) {
  .link_official {
    margin: 10px 0px;
    float: right; }

  div#main article.article {
    padding: 0; }

  div.categoryHead h2 {
    padding: 0; }

  .topicNewsList {
    padding: 0; }

  .article .categoryHead .topicPath + h2 {
    padding: 0; }

  .outline {
    margin: 25px 0;
    padding: 0;
    font-size: 14px; }

  div.borderTop {
    margin: 0; }

  ul#topicNewsList {
    padding: 0; }

  ul#topicNewsList li {
    padding: 10px 0 10px; }

  ul#topicNewsList li p.newsText {
    font-size: 80%;
    color: #666;
    line-height: 1.3;
    padding-bottom: 5px; }

  ul#topicNewsList li a {
    font-size: 105%;
    line-height: 1.4; } }

/*# sourceMappingURL=style_topic.css.map */