@charset "UTF-8";

/* ======================================================
 * xrcity_add.css
 * ------------------------------------------------------
 * @media print, screen and (min-width: 768px)
 * - Common
 * - Override
 * - PageComponent
 * - Assist
 * - Clearfix
 * PC Media Queries
 * @media only screen and (max-width: 767px)
 * - Common
 * - Override
 * - PageComponent
 * - Assist
 * - Clearfix
 * SP Media Queries
 * Print
====================================================== */

/* ----- keyframes ----- */
@keyframes scroll_down {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

/* ======================================================
 * PC
====================================================== */
@media print,screen and (min-width:768px){
  /* ------------------------------------------------------
   * Common
  ------------------------------------------------------ */
  
  /* ------------------------------------------------------
   * Override
  ------------------------------------------------------ */
  .Main__content {
    max-width: inherit;
    padding-left: 0;
    padding-right: 0;
  }
  .xrcity-hero + * {
    margin-top: 36px !important;
  }
  .xrcity-layout .cmn-button--xrcity > [class*="cmn-button__link"] {
    min-width: 273px;
  }
  
  /* ------------------------------------------------------
   * PageComponent
  ------------------------------------------------------ */
  /* ----- xrcity-hero ----- */
  .xrcity-hero {
    max-width: inherit;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__item {
    padding: 0 18px;
  }
  .xrcity-hero .xrcity-hero__carousel > .xrcity-hero__carousel__object .slick-slide {
    transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
    opacity: .4;
    outline: none;
  }
  .xrcity-hero .xrcity-hero__carousel > .xrcity-hero__carousel__object .slick-slide:not(.slick-active) {
    pointer-events: none;
    outline: none;
  }
  .xrcity-hero .xrcity-hero__carousel > .xrcity-hero__carousel__object .slick-slide.slick-active,
  .xrcity-hero .xrcity-hero__carousel > .xrcity-hero__carousel__object .slick-slide.is-active-next {
    opacity: 1.0;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__link {
    display: block;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__link > .xrcity-hero__carousel__image {
    background-color: #fff;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__link > .xrcity-hero__carousel__image > img {
    transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
  }
  .xrcity-hero .xrcity-hero__carousel a.xrcity-hero__carousel__link:hover > .xrcity-hero__carousel__image > img {
    opacity: .7;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control {
    max-width: calc(1200px + 32px * 2);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px auto 0;
    padding: 0 32px;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow {
    position: relative;
    width: 21px;
    height: 34px;
    display: block;
    padding: 0;
    background: none;
    border: none;
    font-size: 0;
    text-indent: -9999em;
    outline: none;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow::before {
    position: absolute;
    top: 5px;
    width: 24px;
    height: 24px;
    border-top: 6px solid #fff;
    border-right: 6px solid #fff;
    transition: border-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
    opacity: 1.0;
    content: "";
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow:hover::before {
    border-color: #fe4774;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow.slick-prev::before {
    left: 5px;
    transform: rotate(-135deg);
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow.slick-next::before {
    right: 5px;
    transform: rotate(45deg);
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots {
    margin: 0 23px;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots .slick-dots {
    display: flex;
    align-items: center;
    margin: 0 -18px -5px 0;
    padding: 0;
    list-style: none;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots .slick-dots > li {
    height: 8px;
    margin-right: 18px;
    margin-bottom: 5px;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots .slick-dots > li > button {
    width: 58px;
    height: 8px;
    display: block;
    padding: 0;
    background-color: #fff;
    border: none;
    text-indent: -9999em;
    outline: none;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots .slick-dots > li.slick-active button {
    background-color: #fe4774;
  }
  
  /* ----- xrcity-scroll ----- */
  .xrcity-scroll {
    position: relative;
    margin-top: 22px;
    padding-bottom: 46px;
  }
  .xrcity-scroll::after {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 1px;
    height: 35px;
    background-color: #fff;
    animation: scroll_down 1.5s cubic-bezier(1, 0, 0, 1) infinite;
    content: "";
  }
  .xrcity-scroll > .xrcity-scroll__label {
    margin-left: 3px;
    font-family: Oswald,ヒラギノ角ゴ Pro,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,Osaka,Arial,ＭＳ Ｐゴシック,MS PGothic,sans-serif;
    font-size: 2.0rem;
    font-weight: 700;
    text-align: center;
    letter-spacing: 4.5px;
    color: #fff;
  }
   /* ----- xrcity-top-banner ----- */
   .xrcity-top-banner {
     margin: 4em auto;
     text-align: center;
   }
  /* ----- xrcity-whats ----- */
  .xrcity-whats {
  }
  .xrcity-whats .xrcity-whats__heading {
    position: relative;
  }
  .xrcity-whats .xrcity-whats__heading::before {
    position: absolute;
    top: 0;
    left: 0;
    width: calc((360/1920)*100vw);
    height: 100%;
    background-color: #07399f;
    content: "";
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__inner {
    position: relative;
    max-width: 1264px;
    margin: 0 auto;
    padding: 0 32px;
    z-index: 1;
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__title {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 30px 7px 15px 0;
    background-color: #07399f;
    font-size: 7.0rem;
    font-weight: bold;
    line-height: 1.25;
    color: #fff;
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__title::before {
    position: absolute;
    top: 0;
    right: -36px;
    width: 100%;
    height: 100%;
    background-color: #07399f;
    transform: skewX(24deg);
    content: "";
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__title > .xrcity-whats__heading__title__label {
    position: relative;
    display: block;
    z-index: 1;
  }
  .xrcity-whats__heading__title__label__narrow{
    font-weight: normal!important;
  }
  .xrcity-whats .xrcity-whats__item {
    padding: 60px 0 70px;
    border-top: 15px solid #07399f;
  }
  .xrcity-whats .xrcity-whats__item[data-item="2"],
  .xrcity-whats .xrcity-whats__item[data-item="4"] {
    border-left: 15px solid #07399f;
  }
  .xrcity-whats .xrcity-whats__item[data-item="1"],
  .xrcity-whats .xrcity-whats__item[data-item="3"] {
    border-right: 15px solid #07399f;
  }
  .xrcity-whats .xrcity-whats__item[data-item="1"] {
    background-color: #111d41;
  }
  .xrcity-whats .xrcity-whats__item[data-item="2"] {
    background: url("/xrcity/img/xrcity_whats_item_im01.jpg") no-repeat;
    background-size: cover;
    background-position: center;
  }
  .xrcity-whats .xrcity-whats__item[data-item="3"] {
    background: url("/xrcity/img/xrcity_whats_item_im02.jpg") no-repeat;
    background-size: cover;
    background-position: center;
  }
  .xrcity-whats .xrcity-whats__item[data-item="4"] {
    background: url("/xrcity/img/xrcity_whats_item_im03.jpg") no-repeat;
    background-size: cover;
    background-position: center;
  }
  .xrcity-whats .xrcity-whats__item > .xrcity-whats__item__inner {
    max-width: 1200px;
    margin: 0 auto;
  }
  .xrcity-whats .xrcity-whats__item[data-item="1"] > .xrcity-whats__item__inner {
    max-width: 1576px;
    padding: 0 30px;
  }
  .xrcity-whats .xrcity-whats__promotion {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
  }
  .xrcity-whats .xrcity-whats__promotion > .xrcity-whats__promotion__detail {
    width: calc((100% / 2) - 120px);
    padding: 0 30px 40px;
  }
  .xrcity-whats .xrcity-whats__promotion > .xrcity-whats__promotion__movie {
    width: calc((100% / 2) + 120px);
  }
  .xrcity-whats .xrcity-whats__promotion > .xrcity-whats__promotion__movie > *:first-child {
    margin-top: 0;
  }
  .xrcity-whats .xrcity-whats__title {
    margin-bottom: 22px;
    font-size: 6.4rem;
    font-weight: bold;
    line-height: calc(84 / 64);
  }
  .xrcity-whats .xrcity-whats__title > .xrcity-whats__title__label {
    display: inline-block;
    background: linear-gradient(180deg, rgba(2,0,36,0) 0%, rgba(7,57,159,0) 65%, rgba(7,57,159,1) 65%);
  }
  [data-browser="ie11"] .xrcity-whats .xrcity-whats__title > .xrcity-whats__title__label {
    background: linear-gradient(180deg, rgba(7,57,159,0) 0%, rgba(7,57,159,0) 10%, rgba(7,57,159,0) 52%, rgba(7,57,159,1) 52%, rgba(7,57,159,1) 87%, rgba(7,57,159,0) 87%, rgba(7,57,159,0) 100%);
  }
  .xrcity-whats .xrcity-whats__title + * {
    margin-top: 0 !important;
  }
  .xrcity-whats .xrcity-whats__text {
    margin-top: 1em;
  }
  .xrcity-whats .xrcity-whats__media .xrcity-whats__media__detail {
    width: calc(100% / 2);
    min-height: 484px;
    display: flex;
  }
  .xrcity-whats .xrcity-whats__item[data-item="3"] .xrcity-whats__media .xrcity-whats__media__detail {
    margin-left: auto;
  }
  .xrcity-whats .xrcity-whats__media .xrcity-whats__media__image {
    display: none;
  }
  .xrcity-whats .xrcity-whats__box {
    display: flex;
    align-items: center;
    background-color: rgba(20, 22, 42, .8);
  }
  .xrcity-whats .xrcity-whats__box > .xrcity-whats__box__inner {
    padding: 48px 38px 45px 36px;
  }
  .xrcity-whats .xrcity-whats__lead {
    padding: 70px 0 0;
    background-color: #07399f;
  }
  .xrcity-whats .xrcity-whats__lead > .xrcity-whats__lead__inner {
    max-width: 1264px;
    margin: 0 auto;
    padding: 0 32px;
  }
  .xrcity-whats .xrcity-whats__lead .xrcity-whats__lead__text {
    font-size: 5.4rem;
    font-weight: bold;
    text-align: center;
    line-height: calc(81 / 54);
  }
  .xrcity-whats .xrcity-whats__lead .xrcity-scroll {
    margin-top: 38px;
  }
  
   /* ----- xrcity-top-banner ----- */
   .xrcity-top-banner {
    margin: 3em auto;
    text-align: center;
  }
  
  /* ----- xrcity-wrap ----- */
  .xrcity-wrap {
    margin-top: 78px;
  }
  .xrcity-wrap .xrcity-wrap__inner {
    max-width: 1264px;
    margin: 0 auto;
    padding: 0 32px;
  }

  /* ----- xrcity-layout ----- */
  .xrcity-layout {
    position: relative;
  }
  .xrcity-layout + .xrcity-layout {
    margin-top: 42px;
  }
  .xrcity-layout::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 980px 1200px 0 0;
    border-color: rgba(20, 22, 42, .8) transparent transparent transparent;
    content: "";
  }
  .xrcity-layout .xrcity-layout__inner {
    position: relative;
    padding: 42px 50px;
    z-index: 1;
  }

  /* ----- xrcity-heading ----- */
  .xrcity-heading {
    margin-bottom: 14px;
  }
  .xrcity-heading .xrcity-heading__title {
    margin: 0;
    font-size: 4.0rem;
    line-height: calc(56 / 40);
  }

  /* ----- xrcity-text ----- */
  .xrcity-text {
    font-size: 1.8rem;
  }
  
  /* ----- xrcity-video ----- */
  .xrcity-video {
    margin-top: 26px;
  }
  .xrcity-video > *:first-child {
    margin-top: 0;
  }

  /* ----- xrcity-banner ----- */
  .xrcity-banner {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 85px 0 0;
  }
  .xrcity-banner .xrcity-banner__image > .xrcity-banner__image__link {
    display: block;
  }
  .xrcity-banner .xrcity-banner__caption {
    margin-top: 14px;
  }
  /* ----- xrcity-foot ----- */
  .xrcity-foot .xrcity-foot__text{
    margin-top: 1em;
    text-align: center;
  }
  /* ------------------------------------------------------
   * Assist
  ------------------------------------------------------ */
  /* ----- assist-xrcity ----- */
  .assist-xrcity {
  }
  .assist-xrcity .assist-xrcity__open {
    position: fixed;
    top: 50%;
    right: -59px;
    transition: right 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
    transform: translateY(-50%);
    z-index: 1;
  }
  .assist-xrcity .assist-xrcity__open.is-active {
    right: 0;
  }
  .assist-xrcity .assist-xrcity__open > .assist-xrcity__open__trigger {
    position: relative;
    width: 59px;
    height: 118px;
    display: block;
    background-color: #fe4775;
    border-top-left-radius: 60px;
    border-bottom-left-radius: 60px;
    text-indent: -9999em;
    box-shadow: -5px 0 10px 5px rgba(29,34,58,.2);
    opacity: 1.0;
    outline: none;
  }
  .assist-xrcity .assist-xrcity__open > .assist-xrcity__open__trigger:hover {
    background-color: #fff;
  }
  .assist-xrcity .assist-xrcity__open > .assist-xrcity__open__trigger::before {
    position: absolute;
    top: 43px;
    left: 25px;
    width: 30px;
    height: 30px;
    border-top: 6px solid #fff;
    border-right: 6px solid #fff;
    transform: rotate(-135deg);
    content: "";
  }
  .assist-xrcity .assist-xrcity__open > .assist-xrcity__open__trigger:hover::before {
    border-color: #fe4775;
  }
  .assist-xrcity .assist-xrcity__button {
    position: fixed;
    top: 50%;
    right: -80px;
    width: 80px;
    display: inline-block;
    transition: right 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
    transform: translateY(-50%);
    z-index: 1;
  }
  .assist-xrcity .assist-xrcity__button.is-active {
    right: 0 !important;
  }
  .assist-xrcity .assist-xrcity__close {
    position: absolute;
    top: 0;
    left: 0;
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger {
    position: relative;
    display: block;
    width: 33px;
    height: 33px;
    background-color: #fff;
    border: 1px solid #fe4774;
    border-radius: 50%;
    box-shadow: 0 5px 15px 5px rgba(29,34,58,.1);
    text-indent: -9999em;
    opacity: 1.0;
    outline: none;
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger:hover {
    background-color: #fe4774;
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger::before,
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger::after {
    position: absolute;
    top: 14px;
    left: 6px;
    width: 19px;
    height: 2px;
    background-color: #fe4774;
    content: "";
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger::before {
    transform: rotate(45deg);
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger::after {
    transform: rotate(-45deg);
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger:hover::before,
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger:hover::after {
    background-color: #fff;
  }
  .assist-xrcity .assist-xrcity__trigger {
    display: block;
    padding: 15px 0 0 15px;
  }
  .assist-xrcity .assist-xrcity__trigger > [class^="assist-xrcity__trigger__link"] {
    width: 100%;
    display: block;
    padding: 23px 7px 20px;
    background-color: #fff;
    border: 1px solid #fe4774;
    box-shadow: 0 5px 20px 10px rgba(29,34,58,.6);
    text-align: center;
    color: #fe4774;
    outline: none;
  }
  .assist-xrcity .assist-xrcity__trigger > [class^="assist-xrcity__trigger__link"]:hover {
    background-color: #fe4774;
    color: #fff;
  }
  .assist-xrcity .assist-xrcity__trigger > [class^="assist-xrcity__trigger__link"] > .assist-xrcity__trigger__label {
    position: relative;
    display: inline-block;
    padding-bottom: 36px;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    -ms-text-orientation: upright;
    text-orientation: upright;
    font-size: 2.0rem;
    font-weight: 700;
  }
  .assist-xrcity .assist-xrcity__trigger > [class^="assist-xrcity__trigger__link"] > .assist-xrcity__trigger__label::after {
    position: absolute;
    content: "";
  }
  .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link > .assist-xrcity__trigger__label::after {
    left: 10px;
    bottom: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8.5px 0 8.5px 13px;
    border-color: transparent transparent transparent #fe4774;
  }
  body[data-browser="ie11"] .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link > .assist-xrcity__trigger__label::after {
    left: 14px;
  }
  .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link:hover > .assist-xrcity__trigger__label::after {
    border-color: transparent transparent transparent #fff;
  }
  .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link--mail > .assist-xrcity__trigger__label::after {
    left: 8px;
    bottom: 0;
    width: 17px;
    height: 13px;
    margin-top: -6px;
    background: url("/app-files/img/cmn_mail_ic01.png") no-repeat;
  }
  body[data-browser="ie11"] .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link--mail > .assist-xrcity__trigger__label::after {
    left: 12px;
  }
  .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link--mail:hover > .assist-xrcity__trigger__label::after {
    background: url("/app-files/img/cmn_mail_ic02.png") no-repeat;
  }
  
  
  /* ------------------------------------------------------
   * Clearfix
  ------------------------------------------------------ */
  .clearfix::after {
    display: block;
    clear: both;
    content: "";
  }
}

/* ======================================================
 * PC Media Queries
====================================================== */
@media print, screen and (min-width: 768px) and (max-width: 1576px) {
  .xrcity-whats .xrcity-whats__item[data-item="1"] > .xrcity-whats__item__inner {
    padding: 0 calc((30/1576)*100vw);
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__title {
    font-size: calc((70/1576)*100vw);
  }
  .xrcity-whats .xrcity-whats__title {
    font-size: calc((64/1576)*100vw);
  }
  .xrcity-whats .xrcity-whats__promotion > .xrcity-whats__promotion__detail {
    padding-left: calc((30/1576)*100vw);
    padding-right: calc((30/1576)*100vw);
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1264px) {
  .xrcity-whats .xrcity-whats__media .xrcity-whats__media__detail {
    min-height: calc((484/1264)*100vw);
  }
  .xrcity-whats .xrcity-whats__item {
    padding: calc((60/1264)*100vw) 0 calc((70/1264)*100vw);
  }
  .xrcity-whats .xrcity-whats__box > .xrcity-whats__box__inner {
    padding: calc((48/1264)*100vw) calc((38/1264)*100vw) calc((45/1264)*100vw) calc((36/1264)*100vw);
  }
  .xrcity-whats .xrcity-whats__lead {
    padding: calc((70/1264)*100vw) 0 0;
  }
  .xrcity-whats .xrcity-whats__lead .xrcity-whats__lead__text {
    font-size: calc((54/1264)*100vw);
  }
  .xrcity-layout::before {
    border-width: calc((980/1264)*100vw) calc((1200/1264)*100vw) 0 0;
  }
  .xrcity-heading .xrcity-heading__title {
    font-size: calc((40/1264)*100vw);
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1035px) {
  .xrcity-whats .xrcity-whats__title {
    font-size: calc((38/1035)*100vw);
  }
}

/* ======================================================
 * SP
====================================================== */
@media only screen and (max-width:767.98px){
  /* ------------------------------------------------------
   * Common
  ------------------------------------------------------ */
  
  /* ------------------------------------------------------
   * Override
  ------------------------------------------------------ */
  .xrcity-hero + * {
    margin-top: 28px !important;
  }
  .xrcity-layout .xrcity-video + .cmn-button--xrcity {
    margin-top: 16px;
  }
  .xrcity-layout .cmn-button--xrcity > [class*="cmn-button__link"] {
    min-width: 165px;
  }
  .info-btn {
    margin-bottom: 0;
  }
  
  /* ------------------------------------------------------
   * PageComponent
  ------------------------------------------------------ */
  /* ----- xrcity-hero ----- */
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__item {
    padding: 0 8px;
  }
  .xrcity-hero .xrcity-hero__carousel > .xrcity-hero__carousel__object .slick-slide {
    transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
    opacity: .4;
    outline: none;
  }
  .xrcity-hero .xrcity-hero__carousel > .xrcity-hero__carousel__object .slick-slide:not(.slick-active) {
    pointer-events: none;
    outline: none;
  }
  .xrcity-hero .xrcity-hero__carousel > .xrcity-hero__carousel__object .slick-slide.slick-active,
  .xrcity-hero .xrcity-hero__carousel > .xrcity-hero__carousel__object .slick-slide.is-active-next {
    opacity: 1.0;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__link {
    display: block;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__link > .xrcity-hero__carousel__image {
    background-color: #fff;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__link > .xrcity-hero__carousel__image > img {
    transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
  }
  .xrcity-hero .xrcity-hero__carousel a.xrcity-hero__carousel__link:hover > .xrcity-hero__carousel__image > img {
    opacity: .7;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 18px auto 0;
    padding: 0 15px;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow {
    position: relative;
    width: 17px;
    height: 17px;
    display: block;
    padding: 0;
    background: none;
    border: none;
    font-size: 0;
    text-indent: -9999em;
    outline: none;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow::before {
    position: absolute;
    top: 2px;
    width: 12px;
    height: 12px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transition: border-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
    opacity: 1.0;
    content: "";
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow.slick-prev::before {
    left: 5px;
    transform: rotate(-135deg);
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .slick-arrow.slick-next::before {
    right: 5px;
    transform: rotate(45deg);
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots {
    margin: 0 23px;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots .slick-dots {
    display: flex;
    align-items: center;
    margin: 0 -10px -5px 0;
    padding: 0;
    list-style: none;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots .slick-dots > li {
    height: 4px;
    margin-right: 10px;
    margin-bottom: 5px;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots .slick-dots > li > button {
    width: 22px;
    height: 4px;
    display: block;
    padding: 0;
    background-color: #fff;
    border: none;
    text-indent: -9999em;
    outline: none;
  }
  .xrcity-hero .xrcity-hero__carousel .xrcity-hero__carousel__control .xrcity-hero__carousel__dots .slick-dots > li.slick-active button {
    background-color: #fe4774;
  }
  
  /* ----- xrcity-scroll ----- */
  .xrcity-scroll {
    position: relative;
    margin-top: 22px;
    padding-bottom: 28px;
  }
  .xrcity-scroll::after {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 1px;
    height: 20px;
    background-color: #fff;
    animation: scroll_down 1.5s cubic-bezier(1, 0, 0, 1) infinite;
    content: "";
  }
  .xrcity-scroll > .xrcity-scroll__label {
    margin-left: 3px;
    font-family: Oswald,ヒラギノ角ゴ Pro,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,Osaka,Arial,ＭＳ Ｐゴシック,MS PGothic,sans-serif;
    font-size: 1.0rem;
    font-weight: 700;
    text-align: center;
    letter-spacing: 2px;
    color: #fff;
  }
  
   /* ----- xrcity-top-banner ----- */
   .xrcity-top-banner {
    margin: 3em auto;
    text-align: center;
  }
  
  /* ----- xrcity-whats ----- */
  .xrcity-whats {
    margin: 0 -15px
  }
  .xrcity-whats .xrcity-whats__heading {
    position: relative;
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__inner {
    position: relative;
    padding: 0 32px 0 0;
    z-index: 1;
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__title {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 16px 0 12px 15px;
    background-color: #07399f;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: calc(90 / 70);
    color: #fff;
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__title::before {
    position: absolute;
    top: 0;
    right: -18px;
    width: 100%;
    height: 100%;
    background-color: #07399f;
    transform: skewX(14deg);
    content: "";
  }
  .xrcity-whats .xrcity-whats__heading .xrcity-whats__heading__title > .xrcity-whats__heading__title__label {
    position: relative;
    display: block;
    z-index: 1;
  }
  .xrcity-whats__heading__title__label__narrow{
    font-weight: normal!important;
  }
  .xrcity-whats .xrcity-whats__item {
    padding: 30px 0 0;
    background-color: #111d41;
    border-top: 7px solid #07399f;
  }
  .xrcity-whats .xrcity-whats__item[data-item="2"],
  .xrcity-whats .xrcity-whats__item[data-item="4"] {
    border-left: 7px solid #07399f;
  }
  .xrcity-whats .xrcity-whats__item[data-item="1"],
  .xrcity-whats .xrcity-whats__item[data-item="3"] {
    border-right: 7px solid #07399f;
  }
  .xrcity-whats .xrcity-whats__item > .xrcity-whats__item__inner {
  }
  .xrcity-whats .xrcity-whats__promotion {
  }
  .xrcity-whats .xrcity-whats__promotion > .xrcity-whats__promotion__detail {
    padding: 0 15px 15px;
  }
  .xrcity-whats .xrcity-whats__promotion > .xrcity-whats__promotion__movie {
  }
  .xrcity-whats .xrcity-whats__promotion > .xrcity-whats__promotion__movie > *:first-child {
    margin-top: 0;
  }
  .xrcity-whats .xrcity-whats__title {
    margin-bottom: 18px;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: calc(84 / 64);
  }
  .xrcity-whats .xrcity-whats__title > .xrcity-whats__title__label {
    display: inline-block;
    background: linear-gradient(180deg, rgba(2,0,36,0) 0%, rgba(7,57,159,0) 65%, rgba(7,57,159,1) 65%);
  }
  .xrcity-whats .xrcity-whats__title + * {
    margin-top: 0 !important;
  }
  .xrcity-whats .xrcity-whats__text {
    margin-top: 1em;
  }
  .xrcity-whats .xrcity-whats__media .xrcity-whats__media__detail {
    padding: 0 15px 20px 10px;
  }
  .xrcity-whats .xrcity-whats__item:nth-child(even) .xrcity-whats__media .xrcity-whats__media__detail {
    display: flex;
    justify-content: flex-end;
    padding-left: 15px;
  }
  .xrcity-whats .xrcity-whats__media .xrcity-whats__media__image {
  }
  .xrcity-whats .xrcity-whats__box {
    width: calc(100% - 15px);
  }
  .xrcity-whats .xrcity-whats__box > .xrcity-whats__box__inner {
  }
  .xrcity-whats .xrcity-whats__lead {
    padding: 22px 0 0;
    background-color: #07399f;
  }
  .xrcity-whats .xrcity-whats__lead > .xrcity-whats__lead__inner {
    padding: 0 15px;
  }
  .xrcity-whats .xrcity-whats__lead .xrcity-whats__lead__text {
    font-size: 2.2rem;
    font-weight: bold;
    text-align: center;
    line-height: calc(81 / 54);
  }
  .xrcity-whats .xrcity-whats__lead .xrcity-scroll {
    margin-top: 22px;
  }
  
   /* ----- xrcity-top-banner ----- */
   .xrcity-top-banner {
    margin: 3em auto;
    text-align: center;
  }
  
  /* ----- xrcity-wrap ----- */
  .xrcity-wrap {
    margin-top: 44px;
  }
  .xrcity-wrap .xrcity-wrap__inner {
  }

  /* ----- xrcity-layout ----- */
  .xrcity-layout {
    position: relative;
    margin: 0 -15px;
  }
  .xrcity-layout + .xrcity-layout {
    margin-top: 16px;
  }
  .xrcity-layout::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 375px calc((375/375)*100vw) 0 0;
    border-color: rgba(20, 22, 42, .8) transparent transparent transparent;
    content: "";
  }
  .xrcity-layout .xrcity-layout__inner {
    position: relative;
    padding: 26px 15px;
    z-index: 1;
  }

  /* ----- xrcity-heading ----- */
  .xrcity-heading {
    margin-bottom: 14px;
  }
  .xrcity-heading .xrcity-heading__title {
    margin: 0;
    font-size: 2.2rem;
    line-height: calc(62 / 44);
  }

  /* ----- xrcity-text ----- */
  .xrcity-text {
  }
  
  /* ----- xrcity-video ----- */
  .xrcity-video {
    margin-top: 12px;
  }
  .xrcity-video > *:first-child {
    margin-top: 0;
  }

  /* ----- xrcity-banner ----- */
  .xrcity-banner {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 28px 0 0;
  }
  .xrcity-banner .xrcity-banner__image > .xrcity-banner__image__link {
    display: block;
  }
  .xrcity-banner .xrcity-banner__caption {
    margin-top: 14px;
  }
  
    /* ----- xrcity-foot ----- */
  .xrcity-foot .xrcity-foot__text{
    margin-top: 1em;
    text-align: center;
  }
  /* ------------------------------------------------------
   * Assist
  ------------------------------------------------------ */
  /* ----- assist-xrcity ----- */
  .assist-xrcity {
  }
  .assist-xrcity.is-fixed {
  }
  .assist-xrcity .assist-xrcity__open {
    position: fixed;
    left: 0;
    bottom: -51px;
    width: 100%;
    display: block;
    border-bottom: 10px solid #fe4774;
    transition: bottom 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
    z-index: 2;
  }
  .assist-xrcity .assist-xrcity__open.is-active {
    bottom: 0;
  }
  .assist-xrcity .assist-xrcity__open > .assist-xrcity__open__trigger {
    position: relative;
    width: 40px;
    height: 25px;
    display: block;
    margin: 0 auto;
    background-color: #fe4775;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    text-indent: -9999em;
    opacity: 1.0;
  }
  .assist-xrcity .assist-xrcity__open > .assist-xrcity__open__trigger::before {
    position: absolute;
    top: 12px;
    left: 13px;
    width: 13px;
    height: 13px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(-45deg);
    content: "";
  }
  .assist-xrcity .assist-xrcity__close {
    position: absolute;
    top: -14px;
    right: 14px;
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger {
    position: relative;
    display: block;
    width: 28px;
    height: 28px;
    background-color: #fff;
    border: 1px solid #fe4774;
    border-radius: 50%;
    box-shadow: 0 0 8px 7px rgba(29,34,58,.2);
    text-indent: -9999em;
    opacity: 1.0;
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger::before,
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger::after {
    position: absolute;
    top: 12px;
    left: 6px;
    width: 14px;
    height: 2px;
    display: block;
    background-color: #fe4774;
    content: "";
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger::before {
    transform: rotate(45deg);
  }
  .assist-xrcity .assist-xrcity__close > .assist-xrcity__close__trigger::after {
    transform: rotate(-45deg);
  }
  .assist-xrcity .assist-xrcity__button {
    position: fixed;
    left: 0;
    bottom: -75px;
    width: 100%;
    transition: bottom 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s;
    z-index: 1;
  }
  .assist-xrcity .assist-xrcity__button.is-active {
    bottom: 0;
  }
  .assist-xrcity .assist-xrcity__trigger > [class^="assist-xrcity__trigger__link"] {
    display: block;
    padding: 15px 16px 12px;
    background-color: #fff;
    border: 1px solid #fe4774;
    color: #fe4774;
    text-align: center;
  }
  .assist-xrcity .assist-xrcity__trigger > [class^="assist-xrcity__trigger__link"] > .assist-xrcity__trigger__label {
    position: relative;
    display: inline-block;
    padding-right: 18px;
    font-size: 2.0rem;
    font-weight: 700;
  }
  .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link--mail > .assist-xrcity__trigger__label {
    padding-right: 25px;
  }
  .assist-xrcity .assist-xrcity__trigger > [class^="assist-xrcity__trigger__link"] > .assist-xrcity__trigger__label::after {
    position: absolute;
    content: "";
  }
  .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link > .assist-xrcity__trigger__label::after {
    top: .7em;
    right: 0;
    width: 0;
    height: 0;
    margin-top: -5px;
    border-style: solid;
    border-width: 5.5px 0 5.5px 10px;
    border-color: transparent transparent transparent #fe4774;
  }
  .assist-xrcity .assist-xrcity__trigger > .assist-xrcity__trigger__link--mail > .assist-xrcity__trigger__label::after {
    top: .7em;
    right: 0;
    width: 18px;
    height: 14px;
    margin-top: -7px;
    background: url("/app-files/img/cmn_mail_ic01-r2x.png") no-repeat;
    background-size: 100% auto;
  }
  
  /* ------------------------------------------------------
   * Clearfix
  ------------------------------------------------------ */
  .clearfix::after {
    display: block;
    clear: both;
    content: "";
  }
}

/* ======================================================
 * SP Media Queries
====================================================== */
@media only screen and (max-width: 736px) {
}
@media only screen and (max-width: 667px) {
}
@media only screen and (max-width: 640px) {
}
@media only screen and (max-width: 568px) {
}
@media only screen and (max-width: 480px) {
}
@media only screen and (max-width: 414px) {
}
@media only screen and (max-width: 375px) {
  .assist-xrcity .assist-xrcity__trigger > [class^="assist-xrcity__trigger__link"] > .assist-xrcity__trigger__label {
    font-size: calc((20/375)*100vw);
  }
}
@media only screen and (max-width: 360px) {
}
@media only screen and (max-width: 345px) {
}
@media only screen and (max-width: 320px) {
}