/*top*/
.snsList{
	text-align: right;
}
.snsList > li{
	display: inline-block;
	margin: 3px;
}
.topWrap{
	background: url(../images/top/top_bg_02nonchara.png) center top no-repeat;
	min-width: 1280px;
	height: 948px;
}
.topLogo{
	position: absolute;
	left: 120px;
	top: 135px;
}
.preBtn{
	display: block;
	width: 336px;
	height: 337px;
	background: url(../images/top/top_regist_off.png) no-repeat;
	-webkit-transition: 0.3s;
	   -moz-transition: 0.3s;
	    -ms-transition: 0.3s;
	     -o-transition: 0.3s;
	        transition: 0.3s;
}
.preBtn:hover{
	background: url(../images/top/top_regist_on.png) no-repeat;
}
.preBtn.is-top{
	position: absolute;
	right: 130px;
	top: 145px;
}

/*gift*/
.giftBox{
	margin: -404px 0 60px;
}
/*about*/
.aboutBox{
	text-align: left;
	width: 1024px;
	margin: 0 auto;
	min-height: 222px;
	background: url(../images/top/about_bg.png) no-repeat right center;
	text-shadow: 0 0 2px#fff,0 0 2px#fff,0 0 2px#fff;
}
.text{

	text-align: left;
}
/*chara*/
.charaBox{
	margin-bottom: 60px;
}
.charaBtnList{
	position: relative;
	width: 962px;
left: 50%;
margin-left: -510px;
	list-style: none;
}
.charaBtnBase{
	cursor: pointer;
	float: left;
	width: 180px;
	height: 210px;
	-webkit-transition: 0.3s;
	   -moz-transition: 0.3s;
	    -ms-transition: 0.3s;
	     -o-transition: 0.3s;
	        transition: 0.3s;
}
.charaBtnBase.is-01{
	width: 242px;
	background: url(../images/top/charaicon01_off.png) no-repeat;
}
.charaBtnBase.is-01:hover,.charaBtnBase.is-01.is-on{
	width: 242px;
	background: url(../images/top/charaicon01_on.png) no-repeat;
}
.charaBtnBase.is-02{
	background: url(../images/top/charaicon02_off.png) no-repeat;
}
.charaBtnBase.is-02:hover,.charaBtnBase.is-02.is-on{
	background: url(../images/top/charaicon02_on.png) no-repeat;
}
.charaBtnBase.is-03{
	background: url(../images/top/charaicon03_off.png) no-repeat;
}
.charaBtnBase.is-03:hover,.charaBtnBase.is-03.is-on{
	background: url(../images/top/charaicon03_on.png) no-repeat;
}
.charaBtnBase.is-04{
	background: url(../images/top/charaicon04_off.png) no-repeat;
}
.charaBtnBase.is-04:hover,.charaBtnBase.is-04.is-on{
	background: url(../images/top/charaicon04_on.png) no-repeat;
}
.charaBtnBase.is-05{
	background: url(../images/top/charaicon05_off.png) no-repeat;
}
.charaBtnBase.is-05:hover,.charaBtnBase.is-05.is-on{
	background: url(../images/top/charaicon05_on.png) no-repeat;
}

.charaImgWrap{
	position: relative;
}

.arrowBase{
	position: absolute;
	width: 53px;
	height: 89px;
	z-index: 2;
}
.arrowBase.is-prev{
	left: 100px;
	top: 50%;
	margin-top: -45px;
	background: url(../images/top/chara_l.png) no-repeat;
}
.arrowBase.is-next{
	right: 100px;
	top: 50%;
	margin-top: -45px;
	background: url(../images/top/chara_r.png) no-repeat;
}
.charaImgBase{
	position: relative;
	width: 1024px;
	height: 418px;
}
.charaImgBase.is-01{
	background: url(../images/top/chara_img01.png) no-repeat;
}
.charaImgBase.is-02{
	background: url(../images/top/chara_img02.png) no-repeat;
}
.charaImgBase.is-03{
	background: url(../images/top/chara_img03.png) no-repeat;
}
.charaImgBase.is-04{
	background: url(../images/top/chara_img04.png) no-repeat;
}
.charaImgBase.is-05{
	background: url(../images/top/chara_img05.png) no-repeat;
}
.charaText{
	position: absolute;
	top: 130px;
	left: 80px;
	text-align: left;
	font-size: 1.6rem;
	line-height: 1.2;
	color: #67593c;
	text-shadow: 0 0 2px#fff,0 0 2px#fff,0 0 2px#fff;
}
.charaText.is-left{
	left: 315px;
}
/*movie*/
.movieWrap{
	background: url(../images/top/map.png) center;
	height: 720px;
}
/*story*/
.storyBox{
	margin-bottom: 60px;
}
/*battle*/
.battleBox{
	margin-bottom: 60px;
}
.cooperationText{
	width: 1000px;
	margin: 0 auto;
	text-align: left;
	font-size: 1.6rem;
}
/*bottom*/
.bottomWrap{
	position: relative;
	height: 799px;
	background: url(../images/top/btm_bg.png) no-repeat center bottom;
}
.preBtn.is-bottom{
	position: absolute;
	right: 130px;
	top: 100px;
}
.segaLogoBox{
	padding: 20px;
}
.segaLogoBox li{
	display: table-cell;
	vertical-align: bottom;
}
.segaLogo{
	width: 150px;
	height: 49px;
	margin-right: 20px;
	background: url(https://cmn.sega-net.com/image/sega_logo_s.svg) no-repeat;
}
.footerInner{
	font-size: 1.4rem;
	width: 100%;
	color: #FFF;
	text-align: left;
	position: absolute;
	left: 0;
	bottom: 0;
	background: rgba(0,0,0,0.6);
}
.footerInner p{
	text-align: left;
}
.footerInner ul {
	list-style: none;
}
.link{
	padding: 10px 0;
	text-align: left;
}
.link li{
	display: inline-block;
	margin-left: 5px;
	font-size: 1.4rem;
}
.link a{
	color: #FFF;
	text-decoration: underline;
}
.pirika{
	display: none;
position: fixed;
    z-index: 110;
    bottom: 20px;
    right: 20px;
}
.checkWrap{
	position: absolute;
	right: 182px;
	top: 480px;
}
.checkWrap.is-02{
	position: absolute;
	right: 180px;
	top: 440px;
}
.checkInput{
	display: none;
}
.checkText{
	position: relative;
	width: 232px;
}

.checkInput.is-01 + .checkText:before{
  content: "";
  display: block;
  position: absolute;
  top: 12px;
  left: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #705020;
  border-radius: 4px;
}
.checkInput.is-01:checked +  .checkText:before{
	background: #50bde3;
}
.checkInput.is-01:checked + .checkText:after{
  content: "";
  display: block;
  position: absolute;
    top: 12px;
    left: 7px;
  width: 9px;
  height: 18px;
  transform: rotate(40deg);
  border-bottom: 3px solid #010e1f;
  border-right: 3px solid #010e1f;
}

.checkInput.is-02 + .checkText:before{
  content: "";
  display: block;
  position: absolute;
  top: 12px;
  left: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #705020;
  border-radius: 4px;
}
.checkInput.is-02:checked +  .checkText:before{
	background: #50bde3;
}
.checkInput.is-02:checked + .checkText:after{
  content: "";
  display: block;
  position: absolute;
    top: 12px;
    left: 7px;
  width: 9px;
  height: 18px;
  transform: rotate(40deg);
  border-bottom: 3px solid #010e1f;
  border-right: 3px solid #010e1f;
}