@charset "UTF-8";
@import "../common/css/gecko.css";
html {
  background:#000;
}
body {
  font-size:12px;
}
a {
  font-weight:bold;
  color:yellow;
}
#campMenu {
  width:100%;
  height:30px;
  text-align:center;
  background:url("../common/images/cmn_bg_headmenu.jpg") repeat-x top left;
}
  #campMenu li{
    display:-moz-inline-box;
    display:inline-block;
    /display:inline;
    /zoom:1;
    padding-left:20px;
    padding-right:20px;
    background:url("../common/images/cmn_ico_menu.jpg") no-repeat top left;
  }
  #campMenu li.new a{
    display:block;
    padding-left:40px;
    background:url("../common/images/cmn_ico_new.jpg") no-repeat top left;
  }
#campWrap {
  margin:0 auto 0;
  background:#000 url("./images/depth2_bg_html.jpg") no-repeat top center;
}
/*
 *  #campHead
 */
#campHead {
  position:relative;
  left:-30px;
  width:818px;
  height:106px;
  margin:0 auto 0;
  z-index:2;
}
  #campHead h1 {
    position:absolute;
    top:52px;
    left:-20px;
  }
/*
 *  .topPager
 */
  .topPager {
    width:818px;
    margin:0 auto 0;
    overflow:hidden;
  }
    .topPager li{float:left;}
      .topPager li a{
        display:block;
        height:64px;
        text-indent:-9999pt;
        overflow:hidden;
      }
        .topPager li.page1 a{
          width:278px;
          background:url("./images/detail_btnset_mainnav.png") no-repeat top left;
        }
        .topPager li.page2 a{
          width:267px;
          background:url("./images/detail_btnset_mainnav.png") no-repeat top center;
        }
        .topPager li.page3 a{
          width:273px;
          background:url("./images/detail_btnset_mainnav.png") no-repeat top right;
        }
        /* link */
        .topPager li.page1 a:link{background-position:top left;}
        .topPager li.page2 a:link{background-position:top center;}
        .topPager li.page3 a:link{background-position:top right;}
        /* visited */
        .topPager li.page1 a:visited{background-position:top left;}
        .topPager li.page2 a:visited{background-position:top center;}
        .topPager li.page3 a:visited{background-position:top right;}
        /* hover */
        .topPager li.page1 a:hover{background-position:bottom left;}
        .topPager li.page2 a:hover{background-position:bottom center;}
        .topPager li.page3 a:hover{background-position:bottom right;}
        /* active */
        .topPager li.page1 a:active{background-position:bottom left;}
        .topPager li.page2 a:active{background-position:bottom center;}
        .topPager li.page3 a:active{background-position:bottom right;}
        /* detailePage1 */
        #detailPage1 li.page1 a:link{background-position:bottom left;}
        #detailPage1 li.page1 a:visited{background-position:bottom left;}
        #detailPage1 li.page1 a:hover{background-position:bottom left;}
        #detailPage1 li.page1 a:active{background-position:bottom left;}
        /* detailePage2 */
        #detailPage2 li.page2 a:link{background-position:bottom center;}
        #detailPage2 li.page2 a:visited{background-position:bottom center;}
        #detailPage2 li.page2 a:hover{background-position:bottom center;}
        #detailPage2 li.page2 a:active{background-position:bottom center;}
        /* detailePage3 */
        #detailPage3 li.page3 a:link{background-position:bottom right;}
        #detailPage3 li.page3 a:visited{background-position:bottom right;}
        #detailPage3 li.page3 a:hover{background-position:bottom right;}
        #detailPage3 li.page3 a:active{background-position:bottom right;}




#campMain {
  width:847px;
  margin:0 auto 10px;
  position:relative;
  overflow:hidden;
}
/*
 * mainArticleWrap
 */
.mainArticleWrap {
  position:relative;
  z-index:1;
  width:788px;
  height:500px;
  height:auto !important;
  min-height:500px;
  padding:0px 0px 0px 0px;
  margin-bottom:10px;
  background:url("./images/detail_bg_middle.jpg") repeat-y top left;
  color:#fff;
}
  .articleTop {
    position:absolute;
    top:0;
    left:0;
  }
  .articleBottom {
    position:absolute;
    bottom:0;
    _bottom:-1px;
    left:0;
  }
  .article { padding:0px 20px;}

/*
 * 赤壁の説明
 */
  #page1_1 {
    line-height:1.5;
    padding:60px 50px 50px;
    background:url("./images/detail_bg_page1_1.jpg") no-repeat top left;
  }
/*
 * 日本の説明
 */
  #page1_2 {
    width:788px;
    height:770px;
    margin-bottom:15px;
    background:url("./images/detail_bg_page1_2.jpg") no-repeat top left;
  }
    #page1_2 h3 { text-align:center;}
    #page1_2 p { padding:0 20px 10px;}

/*
 * 日本武将試練、さらに新戦闘ルールを公開!
 */
  #page2_1 {
    width:788px;
    padding-top:30px;
    background:url("./images/page2_bg_1.jpg") no-repeat top left;
  }
  #page2_1 p{ padding:5px 0 20px;}
/*
 * ペットシステムやその他、新要素を公開!
 */
  #page3_1{
    padding-top:30px;
    background:url("./images/page3_bg_1.jpg") no-repeat top left;
  }
    #page3_1 p{
      padding:5px 0 5px;
    }
      #page3_2 p {
        position:relative;
        text-align:center;
      }
      #page3_2 p img {
        position:relative;
        z-index:1;
      }
      #page3_2 p span {
        position:absolute;
        display:block;
        width:290px;
        top:280px;
        left:42px;
        z-index:2;
        text-align:left;
      }
/*
 * 新兵種登場!
 */
  #page4_1{
    
  }
    .page4menu {
      padding-top:30px;
      text-align:center;
    }
      .page4menu li{
        display:inline;
      }
        .page4menu li a{
          font-weight:normal;
          color:#fff;
        }
  .page4menu li.current a {
    color:yellow;
    font-weight:bold;
  }
/*
 * 兵種紹介
 */
  .details {
    padding: 0px 0px 10px 0px;
  }
    .details .v80{
    line-height:1.8;
    }
    /* skinNum */
    .skillNum {
      width:111px;
      margin: 10px 0px 10px 1px;
      border-top: 1px solid #fff;
      border-left: 1px solid #fff;
    }
      .skillNum td,.skillNum th {
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
        padding: 5px 5px 3px 5px;
      }
      .skillNum thead td {
        background:#fff;
        font-weight:bold;
        color:#610000;
      }
      .skillNum tbody th {
        width:60%;
        text-align:center;
        font-weight:bold;
      }
      .skillNum tbody td {
        text-align:center;
      }
    /* skillName */
    .skillName {
      width:592px;
      height:209px;
      margin: 10px 0px 10px 1px;
      border-top: 1px solid #fff156;
      border-left: 1px solid #fff156;
    }
      .skillName td,.skillName th {
        border-bottom: 1px solid #fff156;
        border-right: 1px solid #fff156;
        padding: 5px 5px 3px 5px;
      }
      .skillName thead td {
        height:18px;
        font-weight: bold;
        background:#fff156;
        color:#610000;
      }
      .skillName tbody th {
        width:20%;
        text-align:center;
        font-weight:bold;
      }
      .skillName tbody td {}
/*
 *  .bottomPager
 */
.bottomPager {
  width:788px;
  overflow:hidden;
}
.bottomPager li{
  float:left;
}
.bottomPager li a{
  display:block;
  height:24px;
  overflow:hidden;
  text-indent:-9999pt;
}

.bottomPager li.prev ,
.bottomPager li.prev a{ width:254px;}
.bottomPager li.list ,
.bottomPager li.list a{ width:275px;}
.bottomPager li.next ,
.bottomPager li.next a{ width:259px;}

.bottomPager li.prev a{background:url("./images/detail_btnset_pager.jpg") no-repeat top left;}
.bottomPager li.list a{background:url("./images/detail_btnset_pager.jpg") no-repeat top center;}
.bottomPager li.next a{background:url("./images/detail_btnset_pager.jpg") no-repeat top right;}

.bottomPager li.prev a:hover{background-position:bottom left;}
.bottomPager li.list a:hover{background-position:bottom center;}
.bottomPager li.next a:hover{background-position:bottom right;}









#campFoot {
  width:788px;
  margin:0 0 10px;
  padding:5px 0;
  background:url("../common/images/cmn_bg_footer.jpg") no-repeat top left;
  height:8px;
}
#bnrArea {
  width:788px;
  margin-top:10px;
  padding-top:10px;
}
  #bnrArea li{
    text-align:center;
  }
#campFoot #campCopyright{
  color:#fff;
  text-align:center;
  font-size:10px;
}

