@charset "UTF-8";
@import "append.css";
@import "jquery.bxslider.css";
@import "magnific-popup.css";

/* =========================================================

    FANDC.CO.JP
    『部活規格』

    Copyright (C)2005 FC01/HQ (C)FANDC.CO.JP

========================================================= */


* { margin: 0; padding: 0; }

html {
  color: #000;
  background: #fff;
}

body {
  margin: 0 auto;
  width: 760px;
  font-size: 12px;
  text-align: left;
  padding-top: 10px;
  font-family: 'Lucida Grande','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
}

h1 {  font-size: 20px; }
h2 {  font-size: 15px; }

img {
  border-width: 0;
  vertical-align: top;
}

a {
  color: #FFBEED;
  text-decoration: none;
  font-weight: bold;
  font-style: normal;
}

a:hover {
  color: #FFBEED;
  text-decoration: underline;
}

p {
  line-height: 1.5;
  letter-spacing: 0.3px;
}

.bold {
  font-weight: bold;
}

.bold-staffname {
  padding: 1px 0 1px 5px;
  font-weight: bold;
  border: 1px solid #fff;  
  color: #fff;
}

.pinkbold {
  color: #FF00CC;
  font-weight: bold;
}

.pink {
  color: #FFBEED;
}

.yellow {
  color: #FFFFAF;
}

.yellow2 {
  font-size: 11px;
  color: #FFFFAF;
}

.yellow3 {
  color: #FFFFAF;
  padding: 5px 0 5px 0;
}

.red {
  color: #ff0000;
}

.blue {
  color: #A4E6FF;
}

.border {
  border: 1px solid #fff;
}

.border-bottom {
  margin: 5px 0 5px 0;
  border-bottom: 1px solid #fff;
}

.padding-top {
  padding-top: 5px;
}

.space {
  padding: 5px 0 5px 0;
}

.center {
  text-align: center;
  padding-top: 10px;
}

.center2 {
  text-align: center;
  padding-bottom: 10px;
}

.title {
  text-align: center;
  padding: 3px 0 3px 0;
  font-weight: bold;
}

ul { list-style-type: none; }

*.clear { clear: both }

#main {
  margin: 0 auto;
  width: 750px;
  text-align: center;
  color: #fff;
}

#main2 {
  margin: 0 auto;
  width: 760px;
  height: 500px;
  text-align: center;
  background: url("image/back.png") no-repeat;
  color: #fff;
}

.menu {
  float: left;
  width: 100px;
  height: 200px;
  padding: 230px 0 10px 30px;
  text-align: center; 
}

.menu2 {
  margin: 0 auto;
  text-align: center; 
}

.top {
  float: right;
  width: 485px;
  height: 480px;
  margin: 15px 0 10px 0;
  text-align: left;
}

.top ul {
  padding: 5px 15px 0 0;
/*  height: 17px; */
  overflow: hidden;
}

.top li {
  float: right;
  padding-left: 15px;
/*  height: 17px; */
  overflow: hidden;
}

.top li a {
  display: block;
  height: 17px;
  background-repeat: none;
  background-position: 0 0;
  text-indent: -5000px;
  text-decoration: none;
}

.top li a:hover {
  background-position: 0 -17px;
}

.top li.news { width: 71px;  height: 17px; }
.top li.news a { width: 71px;  height: 17px;  background-image: url("image/1_2.png"); }
.top li.publicity { width: 71px;  height: 17px }
.top li.publicity a { width: 71px;  height: 17px;  background-image: url("image/1_3.png"); }
.top li.salescampaign { width: 72px;  height: 17px; }
.top li.salescampaign a { width: 72px;  height: 17px;  background-image: url("image/1_4.png"); }
.top li.product { width: 71px;  height: 17px; }
.top li.product a { width: 71px;  height: 17px;  background-image: url("image/2_1.png"); }
.top li.story { width: 87px;  height: 15px; }
.top li.story a { width: 87px;  height: 15px;  background-image: url("image/2_2.png"); }
.top li.characters { width: 105px;  height: 15px; }
.top li.characters a { width: 105px;  height: 15px;  background-image: url("image/3_1.png"); }
.top li.samplecg { width: 104px;  height: 16px; }
.top li.samplecg a { width: 104px;  height: 16px;  background-image: url("image/3_2.png"); }
.top li.system { width: 66px;  height: 17px; }
.top li.system a { width: 66px;  height: 17px;  background-image: url("image/4_1.png"); }
.top li.download { width: 106px;  height: 17px; }
.top li.download a { width: 106px;  height: 17px;  background-image: url("image/6_1.png"); }
.top li.themesong { width: 53px;  height: 17px; }
.top li.themesong a { width: 53px;  height: 17px;  background-image: url("image/6_2.png"); }

.box {
/*
float: left;
*/
  width: 417px;
  margin: 5px 0 5px 0;
  padding: 15px;
  border: 1px solid #fff;
  overflow: auto;
  text-align: left;
}

.box {
  float: left;
  width: 417px;
  margin: 5px 0 5px 0;
  padding: 15px;
  border: 1px solid #fff;
  overflow: auto;
  text-align: left;
}

.box1 {
  margin: 0 auto;
  width: 448px;
  margin: 5px 0 5px 0;
  padding: 10px;
  border: 1px solid #fff;
  overflow: auto;
}

.box3 {
/*
  float: left;
*/
  width: 465px;
  height: 428px;
  padding: 5px 5px 10px 0;
  overflow: auto;
  text-align: center;
}

.box3 div {
  padding: 10px 15px 10px 15px;
  text-align: left;
}

.box4 {
/*
  float: left;
*/
  width: 475px;
  height: 395px;
  overflow: auto;
  text-align: left;
}

.box5 {
  margin-top: 20px;
  width: 714px;
  color: #000;
  text-align: left;
  border: 2px solid #000;
  background: #C9BEFF;
  padding: 15px;
}

.box5 div {
  background: #000;
  color: #fff;
  padding: 2px 0 2px 5px;
  margin: 8px 0 5px 0;
}

.box5 p.border {
  background: #fff;
  padding: 10px;
  margin: 5px 0 5px 0;
}

.box5 h1 {
  color: #000;
}

.box table {
  margin: 0 auto;
  width: 448px;
}

.box4 table {
  margin: 0 auto;
  width: 448px;
}

.box4 td {
  padding: 5px 5px 0 0;
}

.storyimage {
  margin: 0 auto
  height: 330px;
  padding: 30px;
  text-align: left;
  background: url("image/story.jpg") no-repeat;
}

.chara {
  margin: 0 auto;
  width: 470px;
  height: 390px;
  padding: 9px 5px 0 0;
}

.return {
  text-align: center;
  padding-top: 10px;
}

br.clear {
  line-height: 0;
  clear: both;
}

address {
  margin: 0 auto;
  width: 760px;
  font-family: Verdana, Chicago, Arial, sans-serif;
  font-size: 10px;
  font-style: normal;
  text-align: center;
  padding: 10px 0 20px 0;
}