@charset "utf-8";
/* ===================================================================
CSS information
 file name  :top.css
 style info :トップページのスタイル

 @BASE
 @HEADER
=================================================================== */
/* ==========================================================
	BASE
========================================================== */
#bg_main_img {
  background: url(../images/top/bg_main_img.jpg) repeat-x center 0;
}
#contents {
  background: url(../images/top/main_img.jpg) no-repeat center 0;
  position: relative;
}
#contents .bnr_tokuten {
  position: absolute;
  bottom: 150px;
  left: 50%;
  margin: 0 0 0 194px;
}
.bg_logo {
  display: none;
}
h2 {
  margin: 0 0 349px;
  padding: 1px 0 0;
  text-align: center;
}

/* トピックス
========================================================== */
.topics_area {
  background: url(../images/top/bg_topics.png) no-repeat center 0;
}
#newslist li {
  overflow: hidden;
}
#newslist dt,
#newslist dd {
  float: left;
}
#newslist dt {
  margin: 0 10px 0 0;
}
.topics_area .topics {
  position: relative;
}
.topics_area .btn_more {
  position: absolute;
  right: 58px;
  top: 16px;
}
.caution {
  padding: 6px 0 0 40px;
}
#tokuten{
  display: -moz-flex;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  width: 1023px;
}
#tokuten p{
  position: relative;
}
#tokuten p:not(:last-child){
  margin:0 16px 0 0;
}
#tokuten .parts_left{
  position: absolute;
  top:0;
  right: 100%;
}
#tokuten .parts_right{
  position: absolute;
  top:0;
  left: 100%;
}

/* ゲーム紹介
========================================================== */
.about_area {
  background: url(../images/top/bg_repeat_about.jpg) repeat-x center 23px;
  margin: 22px 0 0;
}
.about_inner {
  background: url(../images/top/about_01.png) no-repeat center 0;
  padding: 446px 0 108px;
  text-align: center;
}
.about_inner ul{
  width: 980px;
  margin: 0 auto;
  display: -moz-flex;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}
.about_inner li{
  position: relative;
  margin: 0 19px 15px 0;
}
.about_inner li:nth-child(n + 2):not(:nth-child(n + 4)){
 padding: 154px 0 0 0;
}
.about_inner li:nth-child(n + 8):not(:nth-child(n + 12)){
  margin: 0 19px 0px 0;
}
.about_inner li .icon-new {
 display: none;
 position: absolute;
 top: -20px;
 right: 7px;
}
.about_inner li:nth-child(n + 2):not(:nth-child(n + 4)) .icon-new{
 padding: 154px 0 0 0;
}
.about_inner li.new .icon-new {
 display: block;
 text-indent: 0;
}

.about_inner .relative{
  position: relative;
}
.about_inner li .parts_top{
  position: absolute;
  bottom:100%;
  left:0;
}
.about_inner li .parts_right{
  position: absolute;
  top:0;
  left:100%;
}



/* アバター 
========================================================== */
.character_area {
  background: url(../images/top/bg_info.jpg) no-repeat center 0;
  padding: 37px 0 0;
  text-align: center;
}
.character_area .btn {
  background: url(../images/top/info_02.png) no-repeat center 0;
  padding: 502px 0 57px;
}

/* ジャラやスナックとの連動 
========================================================== */
.system_area {
  background: url(../images/top/bg_repeat_system.jpg) repeat-x center 0;
  padding: 64px 0 74px;
  text-align: center;
}

/* バナー 
========================================================== */
.banner_area {
  margin: 0 0 60px;
  text-align: center;
}

/* ==========================================================
  footer_navi
========================================================== */
#footer_navi {
  margin: 18px auto 30px;
}