@charset "UTF-8";
/*
- 共通
- 事前登録ボタン
- 事前登録詳細(必読)ボタン
- デバイスアイコン
- メインコンテンツ
*/

#ttg {
  font-family: "M PLUS 2", メイリオ, sans-serif;
  font-size: 14px;
  font-optical-sizing: auto;
  font-style: normal;
  color: #000;
  box-sizing: border-box;
}

/*==================================================
　共通
==================================================*/
#lp_header_area,
#lp_footer_area {
  position: relative;
  z-index: 5;
}

#container {
  overflow: hidden;
}

img {
  width: 100%;
  height: auto;
}

.reserved {
  pointer-events: none;
}

@media screen and (min-width: 769px) {
  #doemusu-sm .sp {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  #doemusu-sm .pc {
    display: none;
  }
}

/*==========================================================
　事前登録ボタン
===========================================================*/

#ttg .btn.pc-circle a {
  position: absolute;
  top: 125vw;
  left: 50%;
  transform: translate3d(-50%,0,0);
  width: 71%;
  aspect-ratio: 510 / 132;
  font-size: 0;
  background-size: 100% 100%;
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01.png);
}

.webp #ttg .btn.pc-circle a {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01.webp);
}

#ttg .btn.pc-circle a:hover {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01a.png);
}

.webp #ttg .btn.pc-circle a:hover {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01a.webp);
}

#ttg .btn.pc-circle a.reserved {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01off.png);
}

.webp #ttg .btn.pc-circle a.reserved {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01off.webp);
}

#ttg .spec .btns .btn a {
  display: block;
  margin: 0 auto;
  width: 71vw;
  aspect-ratio: 510 / 132;
  font-size: 0;
  background-size: 100% 100%;
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01.png);
}

.webp #ttg .spec .btns .btn a {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01.webp);
}

#ttg .spec .btns .btn a:hover {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01a.png);
}

.webp #ttg .spec .btns .btn a:hover {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01a.webp);
}

#ttg .spec .btns .btn a.reserved {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01off.png);
}

.webp #ttg .spec .btns .btn a.reserved {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_reserve_01off.webp);
}


/* PC表示 */
@media screen and (min-width: 769px) {
  #ttg .btn.pc-circle a {
    top: 35vw;
    left: 52%;
    transform: translate3d(0,0,0);
    width: 11.4%;
    aspect-ratio: 1 / 1;
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_fv_01.png);
  }

  .webp #ttg .btn.pc-circle a {
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_fv_01.webp);
  }

  #ttg .btn.pc-circle a:hover {
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_fv_01a.png);
  }

  .webp #ttg .btn.pc-circle a:hover {
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_fv_01a.webp);
  }

  #ttg .btn.pc-circle a.reserved {
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_fv_01off.png);
  }

  .webp #ttg .btn.pc-circle a.reserved {
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_fv_01off.webp);
  }

  #ttg .spec .btns .btn a {
    margin: 0;
    width: 29.5vw;
  }
}


/*==========================================================
　事前登録詳細(必読)ボタン
===========================================================*/
/* 事前登録詳細(必読) */
#ttg .detail {
  text-align: center;
}

#ttg .fv .detail a {
  position: absolute;
  top: 109vw;
  left: 52%;
  width: 23%;
  aspect-ratio: 182 / 104;
  font-size: 0;
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_detail_01.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

#ttg .btns .detail a {
  display: block;
  width: 23vw;
  aspect-ratio: 182 / 104;
  font-size: 0;
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_detail_01.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.webp #ttg .detail a {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_detail_01.webp);
}

#ttg .detail a:hover {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_detail_01a.png);
}

.webp #ttg .detail a:hover {
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/btn_detail_01a.webp);
}

/* PC表示 */
@media screen and (min-width: 769px) {
  #ttg .fv .detail a {
    top: 31vw;
    left: 57%;
    width: 6.25%;
  }

  #ttg .btns .detail a {
    width: 6.25vw;
  }

}

/*==========================================================
　デバイスアイコン
===========================================================*/
#ttg .detail .device{
  position: absolute;
  top: 106vw;
  left: 77%;
  width: 17%;
}

/* PC表示 */
@media screen and (min-width: 769px) {
  #ttg .detail .device{
    top: 29.5vw;
    left: 51%;
    width: 5.3%;
  }
}

/*=================================
　fv
=================================*/

#ttg .fv {
  position: relative;
  margin-top: -45px;
  width: 100%;
  aspect-ratio: 768 / 1325;
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_fv_sp_01.png) no-repeat center center / 100% 100%;
  z-index: 2;
}

.webp #ttg .fv {
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_fv_sp_01.webp) no-repeat center center / 100% 100%;
}

#ttg .fv_logo {
  position: absolute;
  top: 13vw;
  left: 63%;
  width: 34%;
}

#ttg .fv_catch .catch01 {
  position: absolute;
  top: 18vw;
  left: 50%;
  transform: translate3d(-50%,0,0);
  width: 18%;
}

/* PC表示 */
@media screen and (min-width: 769px) {
  #ttg .fv {
    margin-top: -60px;
    aspect-ratio: 1903 / 1208;
    background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_fv_01.png) no-repeat center center / 100% 100%;
  }

  .webp #ttg .fv {
    background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_fv_01.webp) no-repeat center center / 100% 100%;
  }

  #ttg .fv_logo {
    top: 6vw;
    left: 50%;
    transform: translate3d(-50%,0,0);
    width: 24.7%;
  }

  #ttg .fv_catch .catch01 {
    top: 7vw;
    left: 88%;
    transform: translate3d(0,0,0);
    width: 7.7%;
  }
}

/* 1921px以上の表示 */
@media screen and (min-width: 1921px) {

}

/*=================================
　reward
=================================*/
#ttg .rewards {
  position: relative;
  padding-top: 24vw;
  margin-top: -22vw;
  width: 100%;
  aspect-ratio: 768 / 1213;
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_rewards_sp_01.jpg) no-repeat center center / 100% 100%;
  z-index: 1;
  box-sizing: border-box;
}

.webp #ttg .rewards {
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_rewards_sp_01.webp) no-repeat center center / 100% 100%;
}

#ttg .rewards .main_pic {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}

#ttg .rewards .section_title {
  margin: 0 auto;
  width: 79%;
}

#ttg .rewards .rewards_txt {
  margin: 3vw auto 0;
  width: 77%;
}

#ttg .rewards .rewards_item {
  position: relative;
  margin: 0 auto;
  width: 90%;
}

#ttg .rewards .rewards_item .icon_complete {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  width: 14.3%;
}

#ttg .rewards .rewards_item.complete .icon_complete {
  display: block;
}

/* PC表示 */
@media screen and (min-width: 769px) {
  #ttg .rewards {
    padding-top: 17vw;
    margin-top: -21vw;
    aspect-ratio: 1903 / 1573;
    background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_rewards_01.jpg) no-repeat center center / 100% 100%;
  }

  .webp #ttg .rewards {
    background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_rewards_01.webp) no-repeat center center / 100% 100%;
  }

  #ttg .rewards .section_title {
    width: 33.6%;
  }

  #ttg .rewards .rewards_txt {
    margin: 1vw auto 0;
    width: 31.45%;
  }

  #ttg .rewards .rewards_item {
    width: 49.3%;
  }

  #ttg .rewards .main_pic {
    display: block;
  }
}

/*=================================
　character
=================================*/

#ttg .chara {
  position: relative;
  width: 100%;
  aspect-ratio: 1920 / 980;
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_chara_01.png) repeat center center;
  box-sizing: border-box;
}

.webp #ttg .chara {
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_chara_01.webp) repeat center center;
}

#ttg .chara .section_title {
  position: absolute;
  top: 5vw;
  left: 50%;
  transform: translate3d(-50%,0,0);
  width: 81%;
  z-index: 10;
}

#ttg .chara .chara_icon_container {
  position: absolute;
  bottom: 5vw;
  left: 50%;
  transform: translate3d(-50%,0,0);
  width: 80%;
  z-index: 10;
}

#ttg .chara .chara_icon_container .swiper-wrapper {
  column-gap: 2.3%;
}

#ttg .chara .chara_icon {
  position: relative;
  width: 18.14%;
  filter: grayscale(1);
  cursor: pointer;
}

#ttg .chara .chara_icon::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  pointer-events: none;
}

#ttg .chara .chara_icon.swiper-slide-thumb-active{
  filter: grayscale(0);
}

#ttg .chara .chara_icon.swiper-slide-thumb-active::before{
  border: solid 3px #b84af9;
}

#ttg .chara .chara_icon:hover{
  filter: grayscale(0);
}

#ttg .chara .chara_container {
  position: relative;
  width: 100%;
  z-index: 1;
}

#ttg .chara .chara_container .swiper-wrapper {
  height: auto !important;
}

#ttg .chara .chara_container .chara_box{
  position: relative;
  width: 100%;
  aspect-ratio: 768 / 1000;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_01.png);
}

.webp #ttg .chara .chara_container .chara_box{
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_01.webp);
}

#ttg .chara .chara_container .chara_box:nth-of-type(2){
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_02.png);
}

.webp #ttg .chara .chara_container .chara_box:nth-of-type(2){
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_02.webp);
}

#ttg .chara .chara_container .chara_box:nth-of-type(3){
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_03.png);
}

.webp #ttg .chara .chara_container .chara_box:nth-of-type(3){
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_03.webp);
}

#ttg .chara .chara_container .chara_box:nth-of-type(4){
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_04.png);
}

.webp #ttg .chara .chara_container .chara_box:nth-of-type(4){
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_04.webp);
}

#ttg .chara .chara_container .chara_box:nth-of-type(5){
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_05.png);
}

.webp #ttg .chara .chara_container .chara_box:nth-of-type(5){
  background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_sp_05.webp);
}

#ttg .chara .chara_container .chara_box .chara_txt{
  position: absolute;
  top: 66vw;
  left: 5%;
  width: 52%;
}

/* PC表示 */
@media screen and (min-width: 769px) {
  #ttg .chara .section_title {
    top: 5vw;
    width: 34.5%;
  }

  #ttg .chara .chara_icon_container {
    bottom: 5vw;
    left: 15%;
    transform: translate3d(0,0,0);
    width: 35.3%;
  }

  #ttg .chara .chara_icon.swiper-slide-thumb-active::before{
    border: solid 5px #b84af9;
  }

  #ttg .chara .chara_container .chara_box{
    aspect-ratio: 1920 / 980;
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_01.png);
  }

  .webp #ttg .chara .chara_container .chara_box{
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_01.webp);
  }

  #ttg .chara .chara_container .chara_box:nth-of-type(2){
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_02.png);
  }

  .webp #ttg .chara .chara_container .chara_box:nth-of-type(2){
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_02.webp);
  }

  #ttg .chara .chara_container .chara_box:nth-of-type(3){
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_03.png);
  }

  .webp #ttg .chara .chara_container .chara_box:nth-of-type(3){
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_03.webp);
  }

  #ttg .chara .chara_container .chara_box:nth-of-type(4){
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_04.png);
  }

  .webp #ttg .chara .chara_container .chara_box:nth-of-type(4){
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_04.webp);
  }

  #ttg .chara .chara_container .chara_box:nth-of-type(5){
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_05.png);
  }

  .webp #ttg .chara .chara_container .chara_box:nth-of-type(5){
    background-image: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/pic_chara_05.webp);
  }

  #ttg .chara .chara_container .chara_box .chara_txt{
    top: 14vw;
    left: 16%;
    width: 30%;
  }
}

/*=================================
　world
=================================*/

#ttg .world {
  position: relative;
  padding-top: 8vw;
  width: 100%;
  aspect-ratio: 768 / 952;
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_world_sp_01.jpg) no-repeat center center / cover;
  box-sizing: border-box;
}

.webp #ttg .world {
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_world_sp_01.webp) no-repeat center center / cover;
}

#ttg .world .section_title {
  margin: 0 auto;
  width: 58%;
}

#ttg .world .world_txt {
  margin: 8vw auto 0;
  width: 95%;
}

#ttg .world .world_txt .pc {
  display: none;
}

/* PC表示 */
@media screen and (min-width: 769px) {
  #ttg .world {
    padding-top: 5vw;
    aspect-ratio: 1920 / 980;
    background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_world_01.jpg) no-repeat center center / cover;
  }

  .webp #ttg .world {
    background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_world_01.webp) no-repeat center center / cover;
  }

  #ttg .world .section_title {
    width: 25%;
  }

  #ttg .world .world_txt {
    margin: 2vw auto 0;
    width: 46%;
  }

  #ttg .world .world_txt .pc {
    display: block;
  }

  #ttg .world .world_txt .sp {
    display: none;
  }
}

/*=================================
　spec
=================================*/

#ttg .spec {
  position: relative;
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_spec_01.jpg) repeat center center / cover;
}

.webp #ttg .spec {
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_spec_01.webp) repeat center center / cover;
}

#ttg .spec .inner{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3vw;
  margin: 0 auto;
  padding: 10vw 0;
  width: 95%;
}

#ttg .spec .spec_icon{
  width: 31%;
}

#ttg .spec .spec_list{
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 100%;
  box-sizing: border-box;
}

#ttg .spec .spec_item{
  display: flex;
  gap: 5px;
}

#ttg .spec .spec_item .item_name{
  padding: 5px;
  min-width: 22vw;
  font-size: 3.3vw;
  text-align: center;
  background: rgba(255,255,255,0.8);
}

#ttg .spec .spec_item .item_txt{
  padding: 5px;
  font-size: 3.3vw;
  background: rgba(255,255,255,0.8);
}

#ttg .spec .spec_item .item_txt .sub_txt{
  font-size: 10px;
}

#ttg .spec .notes{
  padding: 3vw;
  margin: 0;
  font-size: 3.3vw;
  line-height: 1.5em;
  text-align: justify;
  background: rgba(255,255,255,0.8);
}

#ttg .spec .notes_title{
  margin-bottom: 3vw;
  font-size: 5vw;
  text-align: center;
}

#ttg .spec .btns{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 1vw;
  width: 100%;
  aspect-ratio: 770 / 352;
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_spec_reserve_01.jpg) repeat center center / cover;
}

/* PC表示 */
@media screen and (min-width: 769px) {
  #ttg .spec .inner{
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    padding: 5vw 0 0;
    width: min(1018px,53vw);
  }

  #ttg .spec .spec_icon{
    width: 20%;
  }

  #ttg .spec .spec_list{
    padding-left: 10px;
    width: 80%;
  }

  #ttg .spec .spec_item .item_name{
    min-width: 6vw;
    font-size: min(18px,9.375vw);
  }

  #ttg .spec .spec_item .item_txt{
    font-size: min(18px,9.375vw);
  }

  #ttg .spec .notes{
    padding: 1vw 2vw;
    margin: 2vw 0;
    font-size: min(18px,9.375vw);
  }

  #ttg .spec .notes_title{
    font-size: 22px;
  }

  #ttg .spec .btns{
    gap: 1vw;
    width: 100%;
    aspect-ratio: 1919 / 377;
    background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_spec_reserve_01.jpg) repeat center center / cover;
  }

  .webp #ttg .spec .btns{
    background: url(https://www.nijiyome.com/nijiyome-img/img/contents/reserve/ttg/bg_spec_reserve_01.webp) repeat center center / cover;
  }
}