@import url("https://fonts.googleapis.com/css?family=Lato");
/* ---------------------------------------------------------- */
/* MIXIN*/
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* body*/
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* wrapper*/
/* ---------------------------------------------------------- */
#wrapper {
  background-image: url("../../detail/nishijin/images/page_bg1.jpg");
  background-position: top center;
  background-repeat: no-repeat;
}
/* ---------------------------------------------------------- */
/* body debug のとき*/
/* ---------------------------------------------------------- */
.debug #loading {
  display: none;
}
.debug #main {
  background-image: url("../../detail/nishijin/images/___atari.jpg");
}
.debug #column1 {
  background: rgba(255,0,0,0.5);
  border-bottom: 1px solid #333;
}
.debug #column2 {
  background: rgba(100,0,0,0.5);
  border-bottom: 1px solid #333;
}
.debug #column3 {
  background: rgba(100,100,0,0.5);
  border-bottom: 1px solid #333;
}
.debug #column4 {
  background: rgba(100,100,100,0.5);
  border-bottom: 1px solid #333;
}
.debug #column5 {
  background: rgba(50,50,100,0.5);
  border-bottom: 1px solid #333;
}
.debug #column6 {
  background: rgba(50,50,100,0.5);
  border-bottom: 1px solid #333;
}
.debug #column7 {
  background: rgba(50,50,50,0.5);
  border-bottom: 1px solid #333;
}
.debug #collaborated {
  background-image: url("../../detail/nishijin/images/___atari2.jpg");
  background-repeat: no-repeat;
  width: 1100px;
  margin: 0 auto;
}
.debug #banner {
  background-image: url("../../detail/nishijin/images/___atari3.jpg");
  background-repeat: no-repeat;
}
/* ---------------------------------------------------------- */
/*  js_parallax */
/* ---------------------------------------------------------- */
.parallax #wrapper,
.parallax #header {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
}
em {
  font-style: italic;
}
/* ---------------------------------------------------------- */
/* main*/
/* ---------------------------------------------------------- */
#main {
  width: 1100px;
  margin: 0 auto;
}
/* ---------------------------------------------------------- */
/* column all*/
/* ---------------------------------------------------------- */
#main > div {
  width: 980px;
  margin: 0 auto;
  position: relative;
}
.detail {
  line-height: 2;
  font-size: 86%;
  letter-spacing: 0.1em;
  word-spacing: 0.1em;
}
/* ---------------------------------------------------------- */
/* column1*/
/* ---------------------------------------------------------- */
#column1 {
  height: 281px;
}
#column1 h2 {
  position: absolute;
  top: 102px;
  left: 296px;
  width: 244px;
}
#column1 h2 img {
  position: relative;
  display: block;
  margin: 0 auto;
}
#column1 .detail {
  position: absolute;
  top: 195px;
  width:100%;
  text-align: center;
  line-height: 1.8;
  font-size: 100%;
}
/* ---------------------------------------------------------- */
/* column2*/
/* ---------------------------------------------------------- */
#column2 {
  height: 480px;
}
#column2 h3,
#column2 h4,
#column2 p {
  position: absolute;
}
#column2 h3 {
  top: 190px;
  left: 577px;
}
#column2 h4 {
  top: 520px;
  left: 143px;
}
#column2 .detail {
  width: 300px;
  top: 236px;
  left: 579px;
  letter-spacing: 0.09em;
}
#column2 .item {
  top: 40px;
  left: 153px;
}
/* ---------------------------------------------------------- */
/* column3*/
/* ---------------------------------------------------------- */
#column3 {
  height: 634px;
}
#column3 h3,
#column3 h4,
#column3 p {
  position: absolute;
}
#column3 h3 {
  top: 177px;
  left: 118px;
}
#column3 .detail {
  width: 350px;
  top: 255px;
  left: 119px;
  letter-spacing: 0.09em;
}
#column3 .item1 {
  top: 57px;
  left: 578px;
}
#column3 .item2 {
  top: 421px;
  left: 290px;
}
#column3 .item3 {
  top: 639px;
  left: 106px;
}
/* ---------------------------------------------------------- */
/* column4*/
/* ---------------------------------------------------------- */
#column4 {
  height: 476px;
}
#column4 h3,
#column4 h4,
#column4 p {
  position: absolute;
}
#column4 h3 {
  top: 145px;
  left: 487px;
}
#column4 .detail {
  top: 221px;
  left: 488px;
  width: 328px;
  letter-spacing: 0.06em;
}
/* ---------------------------------------------------------- */
/* column5*/
/* ---------------------------------------------------------- */
#column5 {
  height: 790px;
}
#column5 h3,
#column5 h4,
#column5 p,
#column5 dl {
  position: absolute;
}
#column5 h3 {
  top: 51px;
  left: 51px;
}
#column5 .detail {
  top: 126px;
  left: 51px;
  width: 325px;
  letter-spacing: 0.05em;
}
#column5 .item {
  top: 8px;
  left: 420px;
}
#column5 table {
  position: absolute;
  top: 370px;
  left: 52px;
}
#column5 dl {
  top: 471px;
  left: 206px;
  width: 567px;
  font-size: 86%;
  line-height: 2.2;
  letter-spacing: 0.1em;
}
#column5 dl dt {
  width: 169px;
  clear: left;
  float: left;
  font-weight: bold;
}
#column5 dl dd {
  width: 370px;
  margin-left: 197px;
}
#column5 dl dd sup {
  position: relative;
  top: -0.1em;
  font-size: 86%;
  vertical-align: top;
}
/* ---------------------------------------------------------- */
/* column6*/
/* ---------------------------------------------------------- */
#column6 {
  height: 297px;
}
#column6 h3,
#column6 h4,
#column6 p {
  position: absolute;
}
#column6 h3 {
  top: 0;
  left: 264px;
}
#column6 .detail {
  top: 74px;
  left: 267px;
  width: 375px;
  letter-spacing: 0.08em;
}
#column6 .detail sup {
  position: relative;
  top: -0.1em;
  font-size: 86%;
  vertical-align: top;
}
#column6 .detail2 {
  top: 187px;
  left: 267px;
  font-size: 86%;
  width: 375px;
  letter-spacing: 0.15em;
  word-spacing: 0.1em;
}
#column6 .detail2 sup {
  position: relative;
  top: -0.1em;
  font-size: 86%;
  vertical-align: top;
}
/* ---------------------------------------------------------- */
/* column7*/
/* ---------------------------------------------------------- */
#column7 {
  height: 860px;
}
#column7 h3,
#column7 h4,
#column7 p,
#column7 ul {
  position: absolute;
}
#column7 h3 {
  top: 13px;
  left: 295px;
}
#column7 h4 {
  top: 228px;
  left: 50px;
}
#column7 div.detail {
  position: absolute;
  top: 136px;
  left: 51px;
  width: 400px;
  height: 376px;
}
#column7 div.detail p {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  height: 376px;
}
#column7 .item {
  top: 136px;
  left: 489px;
}
#column7 ul {
  top: 490px;
  left: 145px;
}
#column7 ul li {
  float: left;
  margin-right: 18px;
}
/* ---------------------------------------------------------- */
/* collaborated*/
/* ---------------------------------------------------------- */
#collaborated {
  height: 982px;
}
#collaborated h3 {
  text-align: center;
  position: relative;
  top: 75px;
}
#collaborated h4 {
  position: absolute;
  left: 164px;
}
#collaborated .creator_left,
#collaborated .creator_right {
  position: absolute;
}
#collaborated .creator_left {
  top: 156px;
  left: 100px;
}
#collaborated .creator_left h4 {
  top: 39px;
}
#collaborated .creator_right {
  top: 156px;
  left: 602px;
}
#collaborated .creator_right h4 {
  top: 40px;
}
#collaborated .pic {
  position: absolute;
  top: 0;
  left: 0;
}
#collaborated h5 {
  position: absolute;
  top: 211px;
  left: 0;
}
#collaborated .detail {
  position: relative;
  width: 400px;
  font-size: 86%;
  line-height: 1.9;
  margin-top: 252px;
  letter-spacing: 0.08em;
}
#collaborated .btn {
  margin-top: 24px;
}
