* {
  font-family: 'Noto Sans JP', sans-serif;
}

.serif {
  font-family: "Nanum Myeongjo";
}



.bt-go .arrow {
  left: 75%
}

.dgoods02 .bt-go .arrow {
  left: 78%
}

.page-title strong {
  letter-spacing: -.07em
}

#universePart5 .page-title strong,
#universePart6 .page-title strong {
  font-size: .22rem;
}

.layer .bt-go>span {
  font-weight: 500;
  font-size: .24rem;
  line-height: .3rem;
}

.layer.type-doc .doc-content .desc ul li {
  line-height: .2rem
}

.preorder-frm .rewards>ul li.achieve:after {
  background-image: url(../img/preorder-reward-achievemark.png)
}

.profile-card .profile li .tit>span {
  font-size: .15rem;
  left: .06rem
}

.pc #navigation {
  column-gap: .12rem
}

.pc .preorder-frm .input-field input {
  text-align: center;
  padding: 0 1em
}

.pc .preorder-frm .doc-btn {
  margin-top: -.02rem
}

.pc .voice .cv-name p {
  font-size: .2rem;
  letter-spacing: -.05em;
}


.pc .scene[data-name="Digital-Goods"] .bt-go>span {
  font-size: .22rem;
  letter-spacing: -.06em
}

.pc .profile-card .description {
  padding-left: .4rem;
  padding-right: .4rem;
  padding-top: .2rem
}

.pc .profile-card .profile {
  padding-top: .2rem;
  padding-bottom: .2rem
}

.pc .page .dc {
  font-size: .15rem;
  line-height: .21rem;
  letter-spacing: -.07em
}

.pc .page .dc.intro {
  font-size: .16rem;
  line-height: .2rem;
  letter-spacing: -.06em
}

.pc .page .dialog .who .name {
  font-weight: 400
}

.pc .page .dialog .words {
  font-size: .16rem;
  line-height: .19rem;
  letter-spacing: -.07em
}

.pc .scene[data-name="Digital-Goods"] .scene-content {
  min-height: calc(100vh - 1.85rem);
  min-height: calc(calc(var(--vh)* 100) - 1.85rem);
}

.pc .scene[data-name="Digital-Goods"] .footer,
.pc .footer .aligner {
  height: 1.85rem;
}

.pc .preorder-frm .rewards.type-6>ul li p span {
  letter-spacing: -.1em;
  font-size: .15rem;
}


.mobile #navigation>li .sub>button span {
  font-size: .2rem;
  font-weight: 400
}

.mobile #navigation>li .sub>button[value="Feature"] {
  margin-left: .28rem
}

.mobile #navigation>li .sub>button[value="Video"] {
  margin-left: .12rem
}


.mobile .scene[data-name="Digital-Goods"] .scene-content {
  min-height: calc(calc(var(--vh)* 100) - 2.92rem);
  height: max(calc(calc(var(--vh)* 100) - 2.92rem), 12.8rem);
}

.mobile .scene[data-name="Digital-Goods"] .footer,
.mobile .footer .aligner {
  height: 2.92rem;
}

.mobile .preorder-frm .input-field input {
  font-size: .2rem
}

.mobile .preorder-frm .user-agree label {
  letter-spacing: -.03em
}

.mobile .preorder-frm .user-agree .all-check label {
  font-size: .21rem
}

.mobile .preorder-frm .user-agree .doc-btn {
  margin: -.02rem 0 0 .12rem
}

.mobile .voice .inner-circle {
  width: 2.7rem
}

.mobile .voice .cv-name p {
  font-size: .19rem;
  width: 1.4rem;
  letter-spacing: -.05em;
}

.mobile .profile-card .description {
  padding-left: .4rem;
  padding-right: .4rem;
  font-size: .17rem;
  letter-spacing: -.07em;
}

.mobile .character-detail .visual {
  left: 82%
}

.mobile .preorder-frm .input-field input {
  padding: 0 1.25em
}


/* v2 Added */

.pc .scene[data-name="Main"] .title {
  margin-top: .4rem
}

.pc .scene[data-name="Main"] .title img {
  height: .63rem
}

.pc .scene[data-name="Main"] .logo {
  width:7rem;
  margin-top: 1.5rem;
  margin-bottom: -.05rem
}

.pc .scene[data-name="Main"] .bt-play+.btn-group {
  margin-top: 1.2rem
}

.pc .scene[data-name="Main"] .btn-group {
  height: .9rem
}

.pc .scene[data-name="Main"] .btn-group>.bt-go {
  width: 4.72rem;
  height: .9rem;
  border-radius: 0
}

.pc .scene[data-name="Main"] .btn-group>.bt-go:before,
.pc .scene[data-name="Main"] .btn-group>.bt-go:after {
  border-radius: .45rem
}

.pc .scene[data-name="Main"] .btn-group>.bt-go>span {
  font-size: .29rem;
  line-height: .4rem;
  font-weight: 600;
}

.pc .scene[data-name="Main"] .btn-group>.bt-go .arrow {
  width: .1rem;
  left: 86.5%
}

.pc .scene[data-name="Main"] .btn-group>.bt-go .line {
  width: 4.56rem
}

.pc .scene[data-name="Main"] .market-buttons {
  margin-top: .22rem
}

.pc .scene[data-name="Main"] .market-buttons>button {
  height: .85rem
}

.pc #floatingUi {
  top: auto;
  transform: none;
  bottom: 3.32rem
}

.pc .banner {
  bottom: 0
}

.pc .preorder-frm:after {
  content: "";
  display: block;
  height: .5rem
}

.pc .preorder-frm .frm-box .notice {
  margin-top: 0;
  margin-bottom: .06rem
}

.pc .preorder-frm .frm-box .char {
  top: 1.6rem
}

.pc .preorder-frm .frm-box .btn-group {
  margin: 0 auto;
  width: 9.8rem;
  padding-top: .35rem;
  display: flex;
  gap: .1rem;
  align-items: stretch;
  justify-content: center;
  height: .98rem
}

.pc .preorder-frm .frm-box .btn-group>button {
  flex: none
}

.pc .preorder-frm .frm-box .btn-group>button>img {
  width: auto;
  max-width: auto;
  height: 100%;
  object-fit: contain
}

.pc .preorder-frm .rewards.type-4>ul {
  left: 1.16rem;
}

.pc .pet-frame{
  z-index:-1
}

.mobile #gnb>.bi {
  width:5.8rem
}

.mobile .page .logo{
  width:4.4rem;
  margin-top: .25rem
}

.mobile .scene[data-name="Main"] .scene-content:before{
  flex:1.4
}

.mobile .scene[data-name="Main"] .title {
  margin-bottom: .36rem;
  margin-top: .64rem;
}

.mobile .scene[data-name="Main"] .title img {
  height: .56rem
}

.mobile .scene[data-name="Main"] .logo {
  width: 5.28rem;
  margin-bottom: 0
}

.mobile .scene[data-name="Main"] .bt-play {
  margin-top: 1.65rem
}

.mobile .scene[data-name="Main"] .bt-play+.btn-group {
  margin-top: 1.55rem
}

.mobile .scene[data-name="Main"] .btn-group {
  height: .82rem
}

.mobile .scene[data-name="Main"] .btn-group>.bt-go {
  width: 4.28rem;
  height: .82rem;
  border-radius: 0
}

.mobile .scene[data-name="Main"] .btn-group>.bt-go:before,
.mobile .scene[data-name="Main"] .btn-group>.bt-go:after {
  border-radius: .42rem
}

.mobile .scene[data-name="Main"] .btn-group>.bt-go>span {
  font-size: .27rem;
  letter-spacing: -.06em;
  line-height: .38rem
}

.mobile .scene[data-name="Main"] .btn-group>.bt-go .arrow {
  width: .11rem;
  left: 86.5%
}

.mobile .scene[data-name="Main"] .btn-group>.bt-go .line {
  width: 4.14rem
}

.mobile .scene[data-name="Main"] .market-buttons {
  width: 100%;
  display: flex;
  height: .56rem;
  gap: .05rem;
  align-items: stretch;
  justify-content: center;
  margin: .14rem 0 -.18rem
}


.mobile .scene[data-name="Main"] .market-buttons>button {
  display: block;
  flex: none;
}

.mobile .scene[data-name="Main"] .market-buttons>button>img {
  display: block;
  height: 100%;
  width: auto;
  object-fit: contain;
}

.mobile .banner {
  width: 6rem;
  height: auto;
  margin: 0 auto
}

.mobile .banner button {
  width: 100%;
  height: 100%;
  display: block;
  position: relative
}

.mobile .banner .swiper-pagination.swiper-pagination-fraction{
  right: .44rem;
  bottom: .44rem
}

.mobile .preorder-frm .frm-box .period {
  font-size: .2rem;
  line-height: .25rem;
  letter-spacing: -.06em
}

.mobile .preorder-frm .frm-box .notice {
  font-size: .14rem;
  line-height: .16rem;
  letter-spacing: -.06em;
  margin-top: .04rem;
  margin-bottom: .13rem
}

.mobile .preorder-frm .frm-box .btn-group {
  margin: 0 auto;
  width: 100%;
  padding-top: .26rem;
  display: flex;
  gap: .08rem;
  align-items: stretch;
  justify-content: center;
  height: .88rem
}

.mobile .preorder-frm .frm-box .btn-group>button {
  flex: none
}

.mobile .preorder-frm .frm-box .btn-group>button>img {
  width: auto;
  max-width: none;
  height: 100%;
  object-fit: contain
}

.mobile .preorder-frm .frm-box .char {
  top: 9rem;
  left: 50%;
  transform: translateZ(0) translateX(-58.4%);
}

.layer[data-name="webshop"] .doc-content .desc {
  font-weight: 500;
  letter-spacing: -.1em;
}

.pc .layer[data-name="webshop"] .doc-content .desc {
  font-size: .26rem
}

.mobile .layer[data-name="webshop"] .doc-content .desc {
  font-size: .19rem;
  left: -.2rem
}



.detail-view .voice{display:none}