@charset "UTF-8";
/* CSS INFORMATION -====================================================
File name : subpage.css
Description : 下層ページ
===================================================================== */
/* =====================================================================
    head
======================================================================*/
.subpage-head {
  padding-top: calc(320 / 686 * 100%);
  background: url(../images/common/img_submv-sp.jpg) no-repeat center top/100% auto;
}

.page-ttl {
  text-align: center;
  padding: 4.8rem 0;
  font-size: 8rem;
  color: #ffffff;
  background-color: #000000;
}
.page-ttl > * {
  display: block;
}
.page-ttl .font-en {
  letter-spacing: 0;
}
.page-ttl small {
  margin-top: 0.2em;
  font-size: 2.4rem;
  font-weight: bold;
  color: #7b80c7;
}

.sub-ttl {
  text-align: center;
  padding: 4.8rem 0;
  font-size: 7rem;
  color: #ffffff;
  background-color: #9094c7;
}
.sub-ttl > * {
  display: block;
}
.sub-ttl .font-en {
  letter-spacing: 0;
}
.sub-ttl small {
  margin-top: 0.2em;
  font-size: 2.4rem;
  font-weight: bold;
  color: #5c5f94;
}

@media screen and (min-width: 768px) {
  .subpage-head {
    padding-top: calc(400 / 1728 * 100%);
    background-image: url(../images/common/img_submv-pc.jpg);
  }
  .page-ttl {
    padding: 2.5rem 0;
  }
  .sub-ttl {
    padding: 3.3rem 0;
    font-size: max(5.2rem, 30px);
  }
}
/* =====================================================================
    ticket
======================================================================*/
.ticket .inner {
  width: 100%;
}
.ticket-box h3 {
  position: relative;
  padding: 6rem 4rem;
  font-size: 133%;
  font-weight: 700;
  line-height: 1.5;
  color: #f6f2fa;
}
.ticket-box h3::before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #7b80c7;
  z-index: -1;
}
.ticket-box figure {
  margin: 0 auto 6.5rem;
  padding-top: 6.5rem;
  width: calc(560 / 686 * 100%);
}
.ticket-box-desc > *:not(.btn-link),
.ticket-box-desc .btn-link a {
  padding: 3.5rem 4rem;
  line-height: 1.2;
  border-top: 1px solid #000000;
}
.ticket-box-desc dl {
  display: flex;
  justify-content: space-between;
}
.ticket-box-desc dl dt {
  position: relative;
  flex-shrink: 0;
  padding-right: 1em;
  width: 12em;
  color: #7b80c7;
}
.ticket-box-desc dl dt::after {
  content: ":";
  position: absolute;
  display: block;
  top: 0;
  right: 0;
}
.ticket-box-desc dl dd {
  text-align: right;
  padding-left: 1em;
  flex-grow: 1;
}
.ticket-box-desc p {
  padding-top: 1.5em !important;
  padding-bottom: 1.5em !important;
  line-height: 1.666 !important;
}
.ticket-box-desc .btn-link a {
  position: relative;
}
.ticket-box-desc .btn-link a::after {
  content: "";
  position: absolute;
  display: block;
  bottom: 2rem;
  right: 2rem;
  width: 2.5rem;
  height: 2.5rem;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 21"><polygon points="19,0 19,17.6 1.7,0.3 0.3,1.7 17.6,19 0,19 0,21 21,21 21,0 "/></svg>');
          mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 21"><polygon points="19,0 19,17.6 1.7,0.3 0.3,1.7 17.6,19 0,19 0,21 21,21 21,0 "/></svg>');
  -webkit-mask-size: contain;
          mask-size: contain;
  background-color: #000000;
  transition: background-color 0.3s ease;
}
@media screen and (min-width: 768px) {
  .ticket-box-desc .btn-link a::after {
    bottom: 0.8rem;
    right: 0.8rem;
    width: 1.6rem;
    height: 1.6rem;
  }
}

@media screen and (min-width: 768px) {
  .ticket-box {
    margin: 0 auto;
    width: calc(1148 / 1728 * 100%);
    min-width: 600px;
  }
  .ticket-box h3 {
    padding: 4rem calc(100 / 1148 * 100%);
    font-size: 120%;
    border-left: 1px solid #f6f2fa;
    border-right: 1px solid #f6f2fa;
  }
  .ticket-box h3::before {
    margin-left: calc(-291 / (1148 - 3) * 100%);
    width: calc(1728 / (1148 - 3) * 100%);
  }
  .ticket-box figure {
    display: grid;
    align-items: center;
    flex-shrink: 0;
    margin: 0 auto;
    padding: calc(40 / 1148 * 100%);
    width: calc(390 / 1148 * 100%);
    border-right: 1px solid #000000;
  }
  .ticket-box-inner {
    display: flex;
    border-left: 1px solid #000000;
    border-right: 1px solid #000000;
  }
  .ticket-box-desc {
    flex-grow: 1;
    display: grid;
    align-items: center;
    width: 100%;
  }
  .ticket-box-desc > * {
    border-top: 1px solid #000000;
  }
  .ticket-box-desc > *:first-child {
    border-top: 0;
  }
  .ticket-box-desc > *:not(.btn-link),
  .ticket-box-desc .btn-link a {
    padding: 2rem 3.5rem;
  }
  .ticket-box-desc .btn-link {
    display: flex;
    flex-wrap: wrap;
  }
  .ticket-box-desc .btn-link a {
    width: 50%;
    border-right: 1px solid #000000;
    position: relative;
    z-index: 1;
  }
  .ticket-box-desc .btn-link a:nth-child(-n+2) {
    border-top: 0;
  }
  .ticket-box-desc .btn-link a:nth-child(2n) {
    border-right: 0;
  }
  .ticket-box-desc .btn-link a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #000000;
    width: 100%;
    height: 0;
    transition: 0.3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    z-index: -1;
  }
  .ticket-box-desc .btn-link a:hover::before {
    height: 100%;
  }
  .ticket-box-desc .btn-link a:hover {
    color: #ffffff;
  }
  .ticket-box-desc .btn-link a:hover::after {
    background-color: #ffffff;
  }
  .ticket-box-desc dt {
    width: 22em;
  }
}
.fee .content-right > *:not(:last-child) {
  border-bottom: 1px solid #000000;
}
.fee-table dl {
  display: flex;
  text-align: center;
  font-weight: 700;
}
.fee-table dl:not(:first-child) {
  border-top: 1px solid #000000;
}
.fee-table dl > * {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 0.1rem;
  padding: 4rem 0;
  /*width: calc(100% / 3);*/
  width: 50%;
  line-height: 1.25;
}
.fee-table dl > *:not(:last-child) {
  border-right: 1px solid #000000;
}
.fee-table dl dt {
  color: #7b80c7;
}
.fee .notice {
  padding: 4rem 4rem;
}
.fee .notice li {
  position: relative;
  padding-left: 1.2em;
  font-size: 80%;
  line-height: 1.416;
}
.fee .notice li::before {
  content: "※";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
}

@media screen and (min-width: 768px) {
  .fee-table dl > * {
    padding: 3.4rem 0;
  }
  .fee .notice {
    padding: 3.4rem 3.5rem;
  }
}
.guide-list > li {
  padding-left: 4rem;
}
.guide-list > li:not(:last-child) {
  border-bottom: 1px solid #000000;
}
.guide-list > li h3 {
  padding: 6.5rem 0;
  font-size: 110%;
  font-weight: 700;
  line-height: 1.3;
  border-bottom: 1px solid #000000;
}
.guide-list > li h3 img {
  width: auto;
  height: 4.9rem;
}
.guide-list-desc {
  line-height: 1.666;
}
.guide-list-desc > li {
  padding: 5rem 0;
}
.guide-list-desc > li:not(:last-child) {
  border-bottom: 1px solid #000000;
}
.guide-list-desc > li a {
  display: inline;
}

@media screen and (min-width: 768px) {
  .guide-list > li {
    display: flex;
    padding-left: 0;
  }
  .guide-list > li h3 {
    display: grid;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4rem;
    width: calc(385 / 576 * 100%);
    border-bottom: 0;
  }
  .guide-list > li h3 img {
    height: 3.4rem;
  }
  .guide-list-desc {
    padding: 0 4rem;
    width: calc(770 / 576 * 100%);
    border-left: 1px solid #000000;
  }
  .guide-list-desc > li {
    padding: 2rem 0;
  }
  .guide-list-desc > li a:hover {
    color: #7b80c7;
  }
}
/* =====================================================================
    highlight
======================================================================*/
.highlight-subttl {
  font-weight: bold;
  font-size: 113%;
  line-height: 1.47;
  color: #7b80c7;
}
.highlight-list {
  counter-reset: number 0;
  overflow: hidden;
}
.highlight-list > li {
  counter-increment: number 1;
  position: relative;
}
.highlight-list > li:not(:last-child)::after {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 100%;
  border-bottom: 1px solid;
}
.highlight-list > li p {
  line-height: 1.666;
}
.highlight-list-img {
  display: flex;
  flex-wrap: wrap;
  gap: 6rem calc(40 / 600 * 100%);
}
.highlight-list-img li {
  width: 100%;
}
.highlight-list-img li figure figcaption {
  margin-top: 0.5em;
  font-size: 80%;
  line-height: 1.333;
  color: #7b80c7;
}
.highlight-list-img li figure figcaption em {
  font-style: normal;
  font-weight: bold;
  font-size: 125%;
}
.highlight-list-img.vert li {
  width: calc(280 / 600 * 100%);
}
@media screen and (max-width: 767px) {
  .highlight-list-img.vert li.large {
    width: 100%;
  }
}

.highlight .highlight-list > li,
.outline .highlight-list > li .contentHalf-left {
  padding: 6.5rem 4rem;
}
.highlight .highlight-list > li > *:not(:last-child),
.outline .highlight-list > li .contentHalf-left > *:not(:last-child) {
  margin-bottom: 1.5em;
}

.highlight .highlight-list > li::before {
  display: block;
  margin-bottom: 6.5rem;
  font-family: "Jost", sans-serif;
  font-size: 133%;
  color: #c1c3e0;
  letter-spacing: 0;
}

@media screen and (min-width: 768px) {
  .highlight-subttl {
    font-size: 120%;
  }
  .highlight-list > li:not(:last-child)::after {
    margin: 0 calc(50% - 50vw);
    width: 100vw;
  }
  .highlight-list-img {
    justify-content: center;
    gap: 4rem 6.6666666667%;
  }
  .highlight-list-img li {
    width: 46.6666666667%;
  }
  .highlight-list-img li.large {
    width: 60%;
  }
  .highlight-list-img.vert {
    gap: 4rem 3.75%;
  }
  .highlight-list-img.vert li {
    width: 30.8333333333%;
  }
  .highlight .highlight-list > li {
    margin: 0 auto;
    padding: 6.5rem 0;
    width: calc(960 / 1728 * 100%);
    min-width: 600px;
  }
  .highlight .highlight-list > li::before {
    margin-bottom: 4rem;
    font-size: 150%;
  }
  .outline .highlight-list > li .contentHalf-left {
    padding: 8rem calc(100 / 1728 * 100%);
  }
}
/* =====================================================================
    ambassador
======================================================================*/
.ambassador-ttl {
  text-align: center;
  padding: 3.8rem 0;
  font-weight: bold;
  font-size: 133%;
  line-height: 1.5;
  color: #ffffff;
  background-color: #9094c7;
}
.ambassador-content {
  padding: 5rem 4rem;
}
@media screen and (max-width: 767px) {
  .ambassador-content {
    display: flex;
    flex-direction: column;
    gap: 6rem 0;
  }
  .ambassador-content .contentHalf-left,
  .ambassador-content .contentHalf-right {
    display: contents;
  }
  .ambassador-content .ambassador-name {
    order: 1;
  }
  .ambassador-content .ambassador-profile {
    order: 4;
  }
  .ambassador-content p {
    order: 2;
  }
  .ambassador-content figure {
    order: 3;
    margin-left: calc(-43 / 600 * 100%);
    width: calc(686 / 600 * 100%);
  }
}
.ambassador-content p {
  line-height: 1.666;
}
.ambassador-name {
  font-weight: bold;
  font-size: 200%;
  line-height: 1.2;
  color: #7b80c7;
}
.ambassador-name small {
  margin-top: 0.3em;
  display: block;
  font-size: 50%;
  font-weight: normal;
}
.ambassador-profile dt {
  margin-bottom: 0.6em;
  font-family: "Jost", sans-serif;
  font-weight: normal;
  font-size: 133%;
  color: #7b80c7;
}
.ambassador-profile dd {
  line-height: 1.666;
}

@media screen and (min-width: 768px) {
  .ambassador-content {
    padding: 6.5rem 0;
  }
  .ambassador-content .contentHalf-left {
    padding: 0 calc(100 / 1728 * 100%);
  }
  .ambassador-content .contentHalf-left > *:not(:last-child) {
    margin-bottom: 4rem;
  }
  .ambassador-content figure {
    width: 88.8888888889%;
  }
  .ambassador-name {
    font-size: 163%;
  }
  .ambassador-name small {
    display: inline-block;
    margin-left: 1em;
  }
  .ambassador-profile {
    padding-top: 1.2em;
    border-top: 1px solid #7b80c7;
  }
  .ambassador-profile dt {
    font-size: 109%;
  }
}
/* =====================================================================
    event
======================================================================*/
.event-content-ttl {
  padding: 4rem 4rem;
  font-weight: bold;
  font-size: 113%;
  line-height: 1.47;
  color: #5c5f94;
  background-color: #c7c9e3;
}
.event-content-subttl {
  position: relative;
  padding-left: 1.3em;
}
.event-content-subttl::before {
  content: "●";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  color: #7b80c7;
}
.event-content-desc {
  padding: 6rem 4rem;
  line-height: 1.666;
}
.event-content-desc > *:not(:last-child) {
  margin-bottom: 1.2em;
}
.event-content-desc .btn-arrow svg {
  stroke: #7b80c7;
  fill: #c7c9e3;
}

.collab-group:not(:first-of-type) {
  margin-top: 11rem;
}
.collab-head {
  padding: 6rem 4rem;
}
.collab-head-ttl {
  text-align: center;
  font-weight: bold;
  font-size: 133%;
  color: #7b80c7;
}
.collab-head p {
  margin-top: 0.5em;
  line-height: 1.666;
}
.collab-link {
  background-color: #c7c9e3;
  border-top: 1px solid #000000;
}
.collab-link dt {
  padding: 3rem 4rem;
  font-size: 113%;
  line-height: 1.47;
  color: #5c5f94;
}
.collab-link .content-left {
  border-bottom: 0;
}
.collab-link dd {
  border-top: 1px solid #000000;
}
.collab-link .btn1 a {
  padding: 0 4rem;
  height: 9rem;
  justify-content: flex-start;
  color: #5c5f94;
  background-color: transparent;
}
.collab-link .btn1 a::after {
  background-color: #5c5f94;
}
.collab-content .content-right > *:not(:first-child) {
  border-top: 1px solid #000000;
}
.collab-content figure {
  margin: 0 auto;
  padding: 6.5rem 0;
  width: calc(560 / 686 * 100%);
}
.collab-content-menu {
  padding: 6rem 4rem;
}
.collab-content-menu dt {
  font-size: 113%;
  line-height: 1.47;
  color: #7b80c7;
}
.collab-content-menu dd {
  margin-top: 0.5em;
  line-height: 1.666;
}
.collab-content-desc, .catalog-content-desc {
  display: flex;
  padding: 3rem 4rem;
  font-weight: bold;
  line-height: 1.333;
}
.collab-content-desc dt, .catalog-content-desc dt {
  position: relative;
  flex-shrink: 0;
  margin-right: 0.8em;
  padding-right: 1em;
  width: 5.5em;
  color: #7b80c7;
}
.collab-content-desc dt::after, .catalog-content-desc dt::after {
  content: "：";
  position: absolute;
  display: block;
  top: 0;
  right: 0;
}

@media screen and (min-width: 768px) {
  .event_collab {
    overflow: hidden;
  }
  .event-content:not(.contentHalf) .contentHalf-left {
    margin: 0 auto;
    width: calc(1152 / 1728 * 100%);
    min-width: 640px;
  }
  .event-content .contentHalf-left {
    padding: 0 calc(100 / 1728 * 100%);
  }
  .event-content-ttl, .event-content-desc {
    padding: 4rem 0;
  }
  .event-content-ttl {
    position: relative;
  }
  .event-content-ttl::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    margin: 0 calc(50% - 50vw);
    width: 100vw;
    height: 100%;
    background-color: #c7c9e3;
    z-index: -1;
  }
  .collab-group:not(:first-of-type) {
    margin-top: 4rem;
  }
  .collab-head {
    margin: 0 auto;
    padding: 4rem calc(100 / 1728 * 100%);
    width: calc(1152 / 1728 * 100%);
    min-width: 640px;
  }
  .collab-head-ttl {
    font-size: 150%;
  }
  .collab-link dt {
    font-size: 120%;
  }
  .collab-link dd {
    border-width: 0 0 0 1px;
  }
  .collab-link .btn1 {
    height: 100%;
  }
  .collab-link .btn1 a {
    height: 100%;
  }
  .collab-link .btn1 a::before {
    background-color: #000000;
  }
  .collab-link .btn1 a:hover {
    color: #ffffff;
  }
  .collab-link .btn1 a:hover::after {
    background-color: #ffffff;
  }
  .collab-content .content-left {
    display: grid;
    align-items: center;
  }
  .collab-content figure {
    padding: 3.3rem 0;
    width: calc(360 / 576 * 100%);
  }
  .collab-content-menu {
    margin-bottom: auto;
    padding: 4rem;
  }
  .collab-content-menu dt {
    font-size: 120%;
  }
  .collab-content-desc, .catalog-content-desc {
    padding: 2rem 4rem;
  }
  .collab-content-desc dt, .catalog-content-desc dt {
    margin-right: 1.5em;
  }
}
/* =====================================================================
    goods
======================================================================*/
.goods_catalog::before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: calc(320 / 686 * 100%);
  background: linear-gradient(to left, transparent 0%, #10101a 100%);
}
.goods_catalog h1 {
  position: absolute;
  top: 0;
  left: 0;
  margin: calc(106 / 686 * 100%) 0 0 calc(42 / 686 * 100%);
  width: calc(360 / 686 * 100%);
}

.catalog-content .contentHalf-left > *:not(:first-child) {
  border-top: 1px solid #000000;
}
.catalog-content .contentHalf-left p {
  padding: 6rem 4rem;
  line-height: 1.666;
}
.goods-list li {
  padding: 6rem 4rem;
  border-bottom: 1px solid #000000;
}
.goods-list li figure {
  margin: 0 auto 6rem;
  width: calc(560 / 600 * 100%);
}
.goods-list li dl {
  margin-bottom: 0.5em;
  font-weight: bold;
  line-height: 1.5;
}
.goods-list li dl dt {
  font-size: 133%;
  color: #7b80c7;
}
.goods-list li dl dd {
  margin-top: 0.4em;
}
.goods-list li p {
  line-height: 1.666;
}

@media screen and (min-width: 768px) {
  .goods_catalog::before {
    width: 50%;
    padding-top: calc(400 / 1728 * 100%);
  }
  .goods_catalog h1 {
    margin: calc(146 / 1728 * 100%) 0 0 calc(80 / 1728 * 100%);
    width: calc(360 / 1728 * 100%);
  }
  .catalog-content .contentHalf-left p {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
  .goods-list {
    display: flex;
    flex-wrap: wrap;
  }
  .goods-list li {
    padding: calc(60 / 1728 * 100%);
    width: 33.3333333333%;
    border-right: 1px solid #000000;
  }
  .goods-list li:nth-child(3n) {
    border-right: 0;
  }
  .goods-list li figure {
    margin: 0 auto 3.5rem;
    width: 52.6863084922%;
  }
}
/* =====================================================================
    specialcomment38dj16a8
======================================================================*/
.specialcomment38dj16a8-ttl {
  text-align: center;
  padding: 3.8rem 0;
  font-weight: bold;
  font-size: 133%;
  line-height: 1.5;
  color: #ffffff;
  background-color: #9094c7;
}
.specialcomment38dj16a8-content {
  padding: 5rem 4rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .specialcomment38dj16a8-content {
    display: flex;
    flex-direction: column;
    gap: 6rem 0;
  }
  .specialcomment38dj16a8-content .contentHalf-left,
  .specialcomment38dj16a8-content .contentHalf-right {
    display: contents;
  }
  .specialcomment38dj16a8-content .specialcomment38dj16a8-name {
    order: 1;
    font-size: 4rem;
  }
  .specialcomment38dj16a8-content .specialcomment38dj16a8-profile {
    order: 4;
  }
  .specialcomment38dj16a8-content p {
    order: 2;
  }
  .specialcomment38dj16a8-content figure {
    order: 3;
    margin-left: calc(-43 / 600 * 100%);
    width: calc(686 / 600 * 100%);
  }
}
.specialcomment38dj16a8-content p {
  line-height: 1.666;
}
.specialcomment38dj16a8-content .message {
  width: 90%;
  background-color: #000;
  padding: 2rem 3rem;
  color: #fff;
  text-align: center;
  margin: 3rem auto;
}
.specialcomment38dj16a8-content .note {
  text-align: left;
}
.specialcomment38dj16a8-name {
  font-weight: bold;
  font-size: 200%;
  line-height: 1.2;
  color: #7b80c7;
}
.specialcomment38dj16a8-name small {
  margin-top: 0.3em;
  display: block;
  font-size: 50%;
  font-weight: normal;
}
.specialcomment38dj16a8-profile dt {
  margin-bottom: 0.6em;
  font-family: "Jost", sans-serif;
  font-weight: normal;
  font-size: 133%;
  color: #7b80c7;
}
.specialcomment38dj16a8-profile dd {
  line-height: 1.666;
}

@media screen and (min-width: 768px) {
  .specialcomment38dj16a8-content {
    padding: 6.5rem 0;
    width: 80%;
    margin: 0 auto;
  }
  .specialcomment38dj16a8-content .contentHalf-left {
    padding: 0 calc(100 / 1728 * 100%);
  }
  .specialcomment38dj16a8-content .contentHalf-left > *:not(:last-child) {
    margin-bottom: 4rem;
  }
  .specialcomment38dj16a8-content figure {
    width: 88.8888888889%;
  }
  .specialcomment38dj16a8-name {
    font-size: 163%;
  }
  .specialcomment38dj16a8-name small {
    display: inline-block;
    margin-left: 1em;
  }
  .specialcomment38dj16a8-profile {
    padding-top: 1.2em;
    border-top: 1px solid #7b80c7;
  }
  .specialcomment38dj16a8-profile dt {
    font-size: 109%;
  }
  .specialcomment38dj16a8 .message {
    max-width: 300px;
  }
}/*# sourceMappingURL=subpage.css.map */