@charset "utf-8";

/* title-area */
#main #title-area {
	height: 35px;
	background: url(../img/title_area_bg.png) no-repeat;
}
#main #title-area h1 {
	position: absolute;
	top: 13px;
	left: 15px;
}
#main #title-area .update {
	top: 13px;
	right: 5px;
}

/* main-inner */
#main #main-inner {
	background: url(../img/bg_main_inner.jpg) repeat-y;
	border: none;
  position: relative;
}
#main #main-inner img {
	vertical-align: bottom;
}

/* main-visual */
#main .main-visual {
	position: relative;
  z-index: 20;
}
#main .main-visual .pos-ab {
	position: absolute;
}
#main .main-visual .chara {
	top: -80px;
	left: 688px;
}
#main .main-visual .episode-ttl {
	top: 243px;
	left: 349px;
}

/* quiz-article */
#main .quiz-article {
  position: relative;
	min-height: 672px;
}

/* db-backnumber */
#db-backnumber {
  position: relative;
  z-index: 10;
	height: 176px;
	background :url(../img/db_backnumber_bg01.png) no-repeat;
}
#db-backnumber ul {
	padding: 55px 0 0 52px;
}
#db-backnumber li {
	position: relative;
	float: left;
	margin: 0 20px 0 0;
}
#db-backnumber .current01 {
	padding:  0 0 34px;
	background: url(../../../img/splatoon_quiz/backnumber_btn_bg01.png) no-repeat 0 100%;
}
#db-backnumber .current02 {
	padding:  0 0 34px;
	background: url(../../../img/splatoon_quiz/backnumber_btn_bg02.png) no-repeat 0 100%;
}
#db-backnumber .current03 {
	padding:  0 0 34px;
	background: url(../../../img/splatoon_quiz/backnumber_btn_bg03.png) no-repeat 0 100%;
}
#db-backnumber .coming-soon-img {
	position: absolute;
	display: block;
	top: 9px;
	left: -1px;
}
#db-backnumber li:nth-child(1):hover {
	padding:  0 0 34px;
	background: url(../../../img/splatoon_quiz/backnumber_btn_bg01.png) no-repeat 0 100%;
}
#db-backnumber li:nth-child(2):hover {
	padding:  0 0 34px;
	background: url(../../../img/splatoon_quiz/backnumber_btn_bg02.png) no-repeat 0 100%;
}
#db-backnumber li:not(.coming-soon):nth-child(3):hover {
	padding:  0 0 34px;
	background: url(../../../img/splatoon_quiz/backnumber_btn_bg03.png) no-repeat 0 100%;
}

/* main-footer */
.main-footer {
	position: relative;
	margin: 20px 0 0;
	padding-bottom: 32px;
}
.f-border {
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid #C1C1C1;
}
.main-footer .f-hard {
	position: absolute;
	top: 0;
	right: 0;
}
.f-border .f-hard {
	top: 20px;
}
.f-wrap {
	margin: 36px 0 0;
}
.main-footer .f-logo {
	float: left;
	width: 320px;
	text-align: center;
}
.main-footer .f-contents {
	float: right;
	width: 514px;
}
.main-footer .f-icon {
	float: left;
}
.main-footer .f-name {
	position: relative;
	float: right;
	width: 443px;
	height: 55px;
}
.main-footer .f-soft-ttl {
	position: absolute;
	top: 10px;
}
.main-footer .f-copyright {
	position: absolute;
	bottom: 10px;
	color: #FFF;
	font-size: 9px;
}
.main-footer .f-note01 {
	margin: 5px 0 15px;
	color: #FFF;
	font-size: 9px;
}
.main-footer .f-btn {
	margin: 15px 0 0;
}

/* clearfix */
.clearfix:after {
	content: '';
	display: block;
	clear: both;
}


/* ---------------------------------
  game
--------------------------------- */

.quiz-article a img{
  transition: opacity 0.2s ease-in-out;
}
.quiz-article a img:hover{
  opacity: 0.8;
}

/* _start */
._start{
  display: none;
  position: relative;
  padding: 45px 0 65px;
}
._start.is-show{
  display: block !important;
}
._start.is-hidden{
  display: none !important;
}
._start__txt{
  position: relative;
  z-index: 2;
  width: 783px;
  margin: 0 auto 23px;
}
._start__chara{
  position: absolute;
  top: 32px;
  left: -41px;
  z-index: 1;
}
._start__btn{
  width: 491px;
  margin: 0 auto;
}

/* _number */
._number{
  display: none;
  height: 672px;
  position: relative;
}
._number.is-show{
  display: block !important;
}
._number.is-hidden{
  display: none !important;
}
._number__img{
  display: block;
  position: absolute;
  top: 175px;
  left: 180px;
  transform: scale(4,4);
  transition: all 0.2s cubic-bezier(1, -0.1, 0.05, 1.25);
}

._number__img.go-effect{
  transform: scale(1,1);
}

/* _ques */
._ques{
  display: none;
  position: relative;
  padding: 10px 0 0;
}
._ques.is-show{
  display: block !important;
}
._ques.is-hidden{
  display: none !important;
}
._ques__num{
  position: absolute;
  top: -29px;
  left: 0;
}
._ques__txt{
  margin: 0 0 20px 159px;
  position: relative;
  z-index: 10;
}
.isWii ._ques__txt{
  margin: 0 0 20px 159px;
  position: relative;
  z-index: 12;
}
._ques__list{
  padding: 0 40px 14px;
  position: relative;
  z-index: 11;
}
._ques__list:after{
  content: '';
  display: block;
  clear: both;
}
._ques__select{
  float: left;
  margin: 0 0 6px;
}
._ques__select:nth-of-type(even){
  float: right;
}
._ques__select:nth-of-type(odd){
  clear: both;
}
._ques__select a{
  display: block;
  position: relative;
}
._ques__bg{
  position: absolute;
  bottom: 23px;
  left: 0;
  z-index: 1;
  transform: scale(0,0);
}
._ques__select a:hover ._ques__bg{
  transform: scale(1,1);
  transition: transform 0.15s cubic-bezier(1, -0.1, 0.05, 1.25);
}
._ques__select:nth-of-type(3),
._ques__select:nth-of-type(4){
  position: relative;
  z-index: 20;
}
.isWii ._ques__select:nth-of-type(3),
.isWii ._ques__select:nth-of-type(4){
  position: relative;
  z-index: 9;
}
._ques__img{
  position: relative;
  z-index: 10;
}
._ques__select a:hover img{
  opacity: 9;
}

/* _check */
._check__bg{
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: #000;
  opacity: 0.8;
}

/* _true */
._true{
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 20;
  width: 100%;
}
._true.is-show{
  display: block !important;
}
._true.is-hidden{
  display: none !important;
}
._true__txt{
  padding: 100px 0 0;
  margin: 0 0 0 10px;
}
._true__cnt{
  position: absolute;
  top: 123px;
  right: 75px;
}
._true__btn{
  opacity: 0;
  width: 331px;
  margin: -97px auto 0;
  transition: opacity 0.3s ease 0.5s;
}
._true__btn.is-show{
  opacity: 1;
}


/* _false */
._false{
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 20;
  width: 100%;
}
._false.is-show{
  display: block !important;
}
._false.is-hidden{
  display: none !important;
}
._false__img{
  padding: 120px 0 0;
  margin: 0 0 26px 200px;
}
._false__btn{
  width: 331px;
  margin: 0 auto;
}
._false__cnt{
  position: absolute;
  top: 125px;
  right: 140px;
}

/* _result */
._result{
  position: relative;
  display: none;
}
._result.is-show{
  display: block !important;
}
._result.is-hidden{
  display: none !important;
}
._result__count{
  position: absolute;
  top: -24px;
  left: 0;
  width: 298px;
  height: 227px;
  background-position: center center;
  background-size: 100%;
}
._result__count img{
  transform: scale(4,4);
  transition: all 0.5s cubic-bezier(1, -0.1, 0.05, 1.25);
  margin: 55px 0 0 65px;
}
._result__count img.is-show{
  transform: scale(1,1);
}
._result__btn{
  opacity: 0;
  position: absolute;
  top: 513px;
  left: 50%;
  margin: 0 0 0 -245px;
  transition: opacity 0.3s ease 0.5s;
}
._result__btn.is-show{
  opacity: 1;
}
._result__txt{
  display: none;
  position: absolute;
  top: 119px;
  left: 0;
  width: 100%;
}
._result__txtA.is-show{
  display: block;
}
._result__txtB.is-show{
  display: block;
}
._result__txtC.is-show{
  display: block;
}
._result__txt span{
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transform: scale(0.8,1.5);
  transition: all 0.4s cubic-bezier(1, -0.1, 0.05, 1.25) 0s;
}
._result__txt span.is-show{
  opacity: 1;
  transform: scale(1,1);
  transition: all 0.4s cubic-bezier(1, -0.1, 0.05, 1.25) 0s;
}
._result__txtA span:nth-of-type(1){
  left: 280px;
}
._result__txtA span:nth-of-type(2){
  left: 332px;
}
._result__txtA span:nth-of-type(3){
  left: 386px;
}
._result__txtA span:nth-of-type(4){
  left: 448px;
}
._result__txtA span:nth-of-type(5){
  left: 505px;
}
._result__txtA span:nth-of-type(6){
  top: 79px;
  left: 164px;
}
._result__txtA span:nth-of-type(7){
  top: 79px;
  left: 216px;
}
._result__txtA span:nth-of-type(8){
  top: 79px;
  left: 290px;
}
._result__txtA span:nth-of-type(9){
  top: 79px;
  left: 361px;
}
._result__txtA span:nth-of-type(10){
  top: 79px;
  left: 433px;
}
._result__txtA span:nth-of-type(11){
  top: 79px;
  left: 508px;
}
._result__txtA span:nth-of-type(12){
  top: 79px;
  left: 576px;
}
._result__txtA span:nth-of-type(13){
  top: 79px;
  left: 653px;
}
._result__txtB span:nth-of-type(1){
  left: 280px;
}
._result__txtB span:nth-of-type(2){
  left: 332px;
}
._result__txtB span:nth-of-type(3){
  left: 386px;
}
._result__txtB span:nth-of-type(4){
  left: 448px;
}
._result__txtB span:nth-of-type(5){
  left: 505px;
}
._result__txtB span:nth-of-type(6){
  top: 79px;
  left: 134px;
}
._result__txtB span:nth-of-type(7){
  top: 79px;
  left: 185px;
}
._result__txtB span:nth-of-type(8){
  top: 79px;
  left: 258px;
}
._result__txtB span:nth-of-type(9){
  top: 79px;
  left: 329px;
}
._result__txtB span:nth-of-type(10){
  top: 79px;
  left: 392px;
}
._result__txtB span:nth-of-type(11){
  top: 79px;
  left: 466px;
}
._result__txtB span:nth-of-type(12){
  top: 79px;
  left: 538px;
}
._result__txtB span:nth-of-type(13){
  top: 79px;
  left: 608px;
}
._result__txtB span:nth-of-type(14){
  top: 79px;
  left: 684px;
}
._result__txtC span:nth-of-type(1){
  left: 280px;
}
._result__txtC span:nth-of-type(2){
  left: 332px;
}
._result__txtC span:nth-of-type(3){
  left: 386px;
}
._result__txtC span:nth-of-type(4){
  left: 448px;
}
._result__txtC span:nth-of-type(5){
  left: 505px;
}
._result__txtC span:nth-of-type(6){
  top: 79px;
  left: 134px;
}
._result__txtC span:nth-of-type(7){
  top: 79px;
  left: 215px;
}
._result__txtC span:nth-of-type(8){
  top: 79px;
  left: 290px;
}
._result__txtC span:nth-of-type(9){
  top: 79px;
  left: 361px;
}
._result__txtC span:nth-of-type(10){
  top: 79px;
  left: 432px;
}
._result__txtC span:nth-of-type(11){
  top: 79px;
  left: 505px;
}
._result__txtC span:nth-of-type(12){
  top: 79px;
  left: 576px;
}
._result__txtC span:nth-of-type(13){
  top: 79px;
  left: 684px;
}

/* _resultA */
._resultA{}
._resultA{}
._resultA{}
._resultA ._result__count{
  background-image: url('../img/game/result_count_bgA.png');
}
._resultA ._result__txtBg{
  margin: 0 0 -30px;
  width: 864px;
  height: 685px;
  background-image: url('../img/game/result_txtA.png');
  background-size: 100%;
}

/* _resultB */
._resultB{}
._resultB{}
._resultB{}
._resultB{}
._resultB ._result__count{
  background-image: url('../img/game/result_count_bgB.png');
}
._resultB ._result__txtBg{
  margin: 0 0 -30px;
  width: 864px;
  height: 685px;
  background-image: url('../img/game/result_txtB.png');
  background-size: 100%;
}

/* _resultC */
._resultC ._result__count{
  background-image: url('../img/game/result_count_bgC.png');
}
._resultC ._result__txtBg{
  width: 100%;
  height: 469px;
  background-image: url('../img/game/result_txtC.png');
  background-position: right top;
  background-repeat: no-repeat;
  background-size: 723px auto;
  padding: 10px 0 0;
}
._resultC{}
._resultC{}




/*
._result__btnWrap{
  width: 580px;
  margin: 0 auto;
  padding: 30px 0 65px;
}
._result__btnWrap:after{
  content: '';
  display: block;
  clear: both;
}
._result__btn--half{
  float: left;
  width: 280px;
}
._result__btn--half:nth-of-type(even){
  float: right;
}
*/