html,
body {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  background: #000; }

.btn-view-change {
  position: absolute;
  right: 42px;
  bottom: 100px;
  z-index: 10;
  cursor: pointer;
  font-family: azo-sans-web, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 200;
  letter-spacing: 0.14em;
  vertical-align: middle;
  color: #fff;
  opacity: 0;
  pointer-events: none; }
  @media (max-width: 768px) {
    .btn-view-change {
      right: 2.60417vw;
      bottom: 23.4375vw;
      font-size: 3.38542vw; } }
  .btn-view-change::before {
    content: "";
    position: absolute;
    width: 63px;
    height: 29px;
    left: -75px;
    top: 50%;
    -webkit-transform: translate3d(0, -50%, 0);
            transform: translate3d(0, -50%, 0);
    background: url(/contents/1/D369/assets/img/icons/rocket.svg) no-repeat center;
    background-size: 100% auto;
    transition: -webkit-transform 800ms;
    transition: transform 800ms;
    transition: transform 800ms, -webkit-transform 800ms;
    transition-timing-function: ease-in-out; }
    @media (max-width: 768px) {
      .btn-view-change::before {
        width: 7.8125vw;
        height: 3.38542vw;
        left: -9.76562vw; } }
  .btn-view-change.js--change::before {
    -webkit-transform: translate3d(0, -50%, 0) rotateZ(180deg);
            transform: translate3d(0, -50%, 0) rotateZ(180deg); }

.btn-info-open {
  opacity: 0;
  color: #fff; }
  @media (max-width: 768px) {
    .btn-info-open {
      display: none; } }
  @media (min-width: 769px) {
    .btn-info-open {
      position: absolute;
      right: 40px;
      bottom: 35px;
      font-size: 19px;
      cursor: pointer; }
      .btn-info-open .btn-info-inner {
        padding: 8px 0;
        height: 22px; }
        .btn-info-open .btn-info-inner .text-icon-info {
          font-family: azo-sans-web, sans-serif;
          font-size: 20px;
          font-style: normal;
          font-weight: 200;
          letter-spacing: 0.14em;
          display: inline-block;
          vertical-align: middle; }
        .btn-info-open .btn-info-inner .icon-info-open {
          background-image: url(/contents/1/D369/assets/img/icons/plus.svg);
          margin-right: 14px;
          display: inline-block;
          vertical-align: middle; } }
      @media (min-width: 769px) and (min-width: 769px) {
        .btn-info-open .btn-info-inner .icon-info-open {
          background-size: 26px 26px;
          width: 26px;
          height: 26px;
          margin-right: 8px; } }

#information {
  position: absolute;
  width: calc(100% - 5.20833vw);
  top: 100%;
  left: 50%;
  transition: all 800ms;
  color: #fff;
  -webkit-transform: translate3d(-50%, 0%, 0) translate3d(0, 5.20833vw, 0);
          transform: translate3d(-50%, 0%, 0) translate3d(0, 5.20833vw, 0);
  z-index: 0; }
  @media (min-width: 769px) {
    #information {
      width: 100%;
      -webkit-transform: translate3d(-50%, 0, 0);
              transform: translate3d(-50%, 0, 0);
      opacity: 0; } }
  #information.new .title-info::before {
    content: "";
    position: absolute;
    width: 2.34375vw;
    height: 2.34375vw;
    top: 2.60417vw;
    left: 2.60417vw;
    border-radius: 2.60417vw;
    background: #fff;
    box-shadow: 0 0 2.34375vw 0.78125vw rgba(202, 121, 253, 0.75);
    -webkit-animation: flash 1.5s linear infinite;
            animation: flash 1.5s linear infinite; }

@-webkit-keyframes flash {
  0%, 100% {
    opacity: 1; }
  50% {
    opacity: 0; } }

@keyframes flash {
  0%, 100% {
    opacity: 1; }
  50% {
    opacity: 0; } }
    @media (min-width: 769px) {
      #information.new .title-info::before {
        display: none; } }
  #information .info-contents {
    box-sizing: border-box;
    position: relative;
    width: 100%;
    height: 100%;
    border: 0.13021vw solid #b6b6b6;
    background: rgba(0, 0, 0, 0.6); }
    @media (min-width: 769px) {
      #information .info-contents {
        width: 480px;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 20;
        -webkit-transform: translate3d(100%, -100%, 0);
                transform: translate3d(100%, -100%, 0);
        height: 100vh;
        border: 1px solid #b6b6b6;
        border-top: none;
        border-bottom: none;
        padding: 35px 0 40px 0; } }
    @media (min-width: 769px) {
      #information .info-contents a:hover {
        opacity: 0.7; } }
    #information .info-contents .btn-info-close {
      background-image: url(/contents/1/D369/assets/img/icons/close.svg); }
      @media (min-width: 769px) {
        #information .info-contents .btn-info-close {
          display: block;
          position: absolute;
          top: 37px;
          right: 40px;
          z-index: 10;
          background-size: 40px auto;
          width: 40px;
          height: 27px; }
          #information .info-contents .btn-info-close:hover {
            opacity: 0.7;
            cursor: pointer; } }
      @media (max-width: 768px) {
        #information .info-contents .btn-info-close {
          display: none; } }
    #information .info-contents .title-info {
      position: relative;
      line-height: 14.58333vw;
      text-align: center;
      font-size: 4.6875vw; }
      @media (min-width: 769px) {
        #information .info-contents .title-info {
          height: auto;
          line-height: 1em;
          margin-bottom: 60px; } }
      #information .info-contents .title-info p {
        font-family: azo-sans-web, sans-serif;
        font-size: 18px;
        font-style: normal;
        font-weight: 200;
        letter-spacing: 0.16em;
        display: block;
        margin-bottom: 15px; }
        @media (min-width: 769px) {
          #information .info-contents .title-info p {
            font-size: 19px;
            line-height: 1em;
            margin-bottom: 60px; } }
      #information .info-contents .title-info .btn-title-info-open {
        background-image: url(/contents/1/D369/assets/img/icons/arrow.svg);
        background-repeat: no-repeat;
        background-position: center;
        width: 19px;
        height: 24px;
        position: absolute;
        top: 15px;
        right: 4.94792vw;
        -webkit-transform: rotate(180deg) scale(-1, 1);
                transform: rotate(180deg) scale(-1, 1); }
        @media (min-width: 769px) {
          #information .info-contents .title-info .btn-title-info-open {
            display: none; } }
    #information .info-contents .list-info {
      padding: 0 2.60417vw; }
      @media (min-width: 769px) {
        #information .info-contents .list-info {
          padding: 0 38px; } }
      #information .info-contents .list-info ul.news li {
        margin-bottom: 20px; }
        @media (min-width: 769px) {
          #information .info-contents .list-info ul.news li {
            margin-bottom: 35px; } }
        #information .info-contents .list-info ul.news li:last-child {
          margin-bottom: 15px; }
          @media (min-width: 769px) {
            #information .info-contents .list-info ul.news li:last-child {
              margin-bottom: 45px; } }
        #information .info-contents .list-info ul.news li a {
          color: #fff;
          text-decoration: none; }
        #information .info-contents .list-info ul.news li p.date {
          font-size: 13px;
          margin-bottom: 10px;
          display: inline-block;
          vertical-align: middle;
          position: relative; }
          @media (min-width: 769px) {
            #information .info-contents .list-info ul.news li p.date {
              font-size: 16px;
              margin-bottom: 13px; } }
          #information .info-contents .list-info ul.news li p.date span.new {
            position: absolute;
            top: -7px;
            right: -68px; }
            @media (min-width: 769px) {
              #information .info-contents .list-info ul.news li p.date span.new {
                top: -8px;
                right: -80px; } }
            #information .info-contents .list-info ul.news li p.date span.new img {
              width: 15.625vw;
              height: auto;
              -webkit-transform: translate3d(0, 0, 0);
                      transform: translate3d(0, 0, 0); }
              @media (min-width: 769px) {
                #information .info-contents .list-info ul.news li p.date span.new img {
                  width: 62px;
                  height: auto; } }
        #information .info-contents .list-info ul.news li p.text {
          font-size: 14px;
          line-height: 1.5;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
          overflow: hidden; }
          @media (min-width: 769px) {
            #information .info-contents .list-info ul.news li p.text {
              font-size: 16px; } }
      #information .info-contents .list-info ul.bnr li {
        margin-bottom: 14px; }
        #information .info-contents .list-info ul.bnr li:last-child {
          margin-bottom: 15px; }
        #information .info-contents .list-info ul.bnr li a img {
          width: 100%;
          height: auto;
          -webkit-transform: translate3d(0, 0, 0);
                  transform: translate3d(0, 0, 0); }
      #information .info-contents .list-info .more_wrap {
        text-align: right;
        margin-bottom: 30px; }
        @media (min-width: 769px) {
          #information .info-contents .list-info .more_wrap {
            margin-bottom: 60px; } }
        #information .info-contents .list-info .more_wrap a {
          color: #b6b6b6;
          font-size: 14px; }
          @media (min-width: 769px) {
            #information .info-contents .list-info .more_wrap a {
              font-size: 16px; } }
  #information.open {
    z-index: 40; }
    @media (max-width: 768px) {
      #information.open .copy {
        display: none; } }
    #information.open .info-contents {
      background: rgba(0, 0, 0, 0.9); }
      #information.open .info-contents .btn-title-info-open {
        top: 5px; }
    #information.open .title-info p {
      margin: 10px auto 20px auto; }
    #information.open .title-info::before {
      display: none; }
  #information .copy {
    position: absolute;
    top: -2.34375vw;
    right: 0;
    font-size: 2.08333vw;
    color: #b6b6b6;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0); }
    @media (min-width: 769px) {
      #information .copy {
        position: absolute;
        left: 40px;
        bottom: 30px;
        right: auto;
        top: auto;
        font-size: 11px; } }

.contents-slider {
  position: fixed;
  height: 40.36458vw;
  bottom: 0;
  left: 0;
  text-align: center;
  color: #fff;
  width: 100%;
  opacity: 0;
  pointer-events: none; }
  .contents-slider .contents-slider-inner {
    position: relative;
    z-index: 2; }
  .contents-slider .bg-contents-slider {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 49.73958vw;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, black 100%); }
    @media (min-width: 769px) {
      .contents-slider .bg-contents-slider {
        height: 160px; } }
  @media (min-width: 769px) {
    .contents-slider {
      height: 165px; } }
  .contents-slider.show {
    opacity: 1;
    transition: all 300ms;
    transition-delay: 200ms; }
    .contents-slider.show .btn-back-top {
      pointer-events: auto; }
  .contents-slider .slides .slide {
    position: absolute;
    bottom: -12.5vw;
    left: 50%;
    width: calc(100% - 5.20833vw);
    opacity: 0;
    transition: all 800ms;
    line-height: 1.7;
    font-size: 3.38542vw;
    -webkit-transform: translate3d(-50%, 0, 0);
            transform: translate3d(-50%, 0, 0); }
    @media (min-width: 769px) {
      .contents-slider .slides .slide {
        bottom: -33px;
        font-size: 16px; } }
    .contents-slider .slides .slide span {
      font-weight: 400; }
    .contents-slider .slides .slide.show {
      opacity: 1; }
  .contents-slider .contents-pager,
  .contents-slider .contents-sub-pager {
    position: absolute;
    left: 50%;
    top: 18.22917vw;
    -webkit-transform: translate3d(-50%, 0, 0) scale(-1, 1);
            transform: translate3d(-50%, 0, 0) scale(-1, 1);
    width: 100%;
    transition: all 400ms; }
    .contents-slider .contents-pager.hide,
    .contents-slider .contents-sub-pager.hide {
      opacity: 0; }
    @media (min-width: 769px) {
      .contents-slider .contents-pager,
      .contents-slider .contents-sub-pager {
        top: 58px; } }
    .contents-slider .contents-pager ul,
    .contents-slider .contents-sub-pager ul {
      text-align: center;
      font-size: 0; }
      .contents-slider .contents-pager ul li,
      .contents-slider .contents-sub-pager ul li {
        position: relative;
        width: 1.04167vw;
        height: 1.04167vw;
        border-radius: 1.04167vw;
        display: inline-block;
        margin: 0 2.47396vw;
        transition: all 400ms;
        background: #8b8a8a;
        top: 2px; }
        @media (min-width: 769px) {
          .contents-slider .contents-pager ul li,
          .contents-slider .contents-sub-pager ul li {
            width: 6px;
            height: 6px;
            border-radius: 6px;
            margin: 0 17px;
            top: 0px; } }
        .contents-slider .contents-pager ul li.current,
        .contents-slider .contents-sub-pager ul li.current {
          background: #FFD700;
          background: #fff;
          -webkit-transform: scale(1.8);
                  transform: scale(1.8); }
  .contents-slider .contents-sub-pager {
    -webkit-transform: translate3d(-50%, 0, 0);
            transform: translate3d(-50%, 0, 0); }
  .contents-slider .btn-back-top {
    position: absolute;
    left: 50%;
    top: 25.52083vw;
    -webkit-transform: translate3d(-50%, 0, 0);
            transform: translate3d(-50%, 0, 0);
    font-size: 15px;
    cursor: pointer;
    padding: 2.60417vw;
    font-family: azo-sans-web, sans-serif;
    font-style: normal;
    font-weight: 200;
    letter-spacing: 0.14em; }
    @media (min-width: 769px) {
      .contents-slider .btn-back-top {
        font-size: 17px;
        top: 85px;
        padding: 12px; } }

@-webkit-keyframes extra-flash-anime {
  0% {
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes extra-flash-anime {
  0% {
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes extra-move-anime {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0); }
  50% {
    -webkit-transform: translate3d(0, 30px, 0);
            transform: translate3d(0, 30px, 0); }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0); } }

@keyframes extra-move-anime {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0); }
  50% {
    -webkit-transform: translate3d(0, 30px, 0);
            transform: translate3d(0, 30px, 0); }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0); } }

* {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

body {
  overflow: hidden; }
  body.load-end.isPointer {
    cursor: pointer; }

.overlay-black.show {
  opacity: 1;
  transition: all 350ms;
  transition-delay: 400ms; }

#btn-global-navi,
#header {
  pointer-events: none;
  opacity: 0; }

.extra {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10000;
  cursor: default; }
  .extra.none {
    display: none !important; }
  .extra.hide {
    opacity: 0 !important;
    pointer-events: none !important;
    transition: all 400ms; }
  .extra.show .extra-bg {
    opacity: 1;
    transition: all 700ms;
    transition-delay: 1900ms; }
  .extra.show .extra-container a {
    pointer-events: auto; }
  .extra.show .extra-container .extra-img {
    transition: all 2800ms;
    transition-delay: 2300ms;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    transition-timing-function: ease-in-out; }
    .extra.show .extra-container .extra-img .extra-img-inner {
      -webkit-animation: extra-move-anime 6000ms ease-in-out infinite;
              animation: extra-move-anime 6000ms ease-in-out infinite;
      -webkit-animation-delay: 4300ms;
              animation-delay: 4300ms; }
      .extra.show .extra-container .extra-img .extra-img-inner .extra-effect {
        -webkit-animation: extra-flash-anime 2000ms ease-in-out infinite;
                animation: extra-flash-anime 2000ms ease-in-out infinite;
        -webkit-animation-delay: 4300ms;
                animation-delay: 4300ms; }
  .extra.show .extra-container .extra-text {
    opacity: 1;
    transition: all 700ms;
    transition-delay: 3800ms; }
  .extra .extra-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.88);
    opacity: 0; }
  .extra .extra-container {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
            transform: translate3d(-50%, -50%, 0);
    pointer-events: none; }
    .extra .extra-container a {
      color: #fff;
      text-decoration: none;
      display: block;
      pointer-events: none; }
    .extra .extra-container .extra-img {
      position: relative;
      margin-bottom: 0;
      -webkit-transform: translate3d(0, -100vh, 0);
              transform: translate3d(0, -100vh, 0); }
      @media (min-width: 769px) {
        .extra .extra-container .extra-img {
          margin-bottom: -20px; } }
      .extra .extra-container .extra-img img {
        width: 67.70833vw;
        height: auto; }
        @media (min-width: 769px) {
          .extra .extra-container .extra-img img {
            width: 400px; } }
      .extra .extra-container .extra-img p {
        position: relative;
        z-index: 1; }
      .extra .extra-container .extra-img .extra-map {
        position: absolute;
        z-index: 2;
        pointer-events: auto;
        top: 50%;
        left: 50%;
        -webkit-transform: translate3d(-50%, -50%, 0);
                transform: translate3d(-50%, -50%, 0); }
        .extra .extra-container .extra-img .extra-map img {
          position: relative;
          top: auto;
          left: auto;
          -webkit-transform: none;
                  transform: none;
          width: 44.27083vw; }
          @media (min-width: 769px) {
            .extra .extra-container .extra-img .extra-map img {
              width: 264px; } }
      .extra .extra-container .extra-img .extra-effect {
        position: absolute;
        z-index: 0;
        top: 0;
        left: 0;
        opacity: 0; }
    .extra .extra-container .extra-text {
      text-align: center;
      opacity: 0;
      font-size: 3.125vw; }
      @media (min-width: 769px) {
        .extra .extra-container .extra-text {
          font-size: 18px; } }

.opening-end #btn-global-navi,
.opening-end .btn-view-change,
.opening-end .btn-info-open {
  opacity: 1;
  transition: all 400ms; }
  .opening-end #btn-global-navi.hide,
  .opening-end .btn-view-change.hide,
  .opening-end .btn-info-open.hide {
    display: none; }

.opening-end .btn-view-change,
.opening-end #btn-global-navi {
  pointer-events: auto; }

.opening-end #header {
  opacity: 1;
  transition: all 400ms; }

.opening-end #information {
  pointer-events: auto;
  opacity: 1;
  transition: all 400ms;
  -webkit-transform: translate3d(-50%, 0%, 0) translate3d(0, -14.32292vw, 0);
          transform: translate3d(-50%, 0%, 0) translate3d(0, -14.32292vw, 0); }
  @media (min-width: 769px) {
    .opening-end #information {
      -webkit-transform: translate3d(-50%, 0%, 0);
              transform: translate3d(-50%, 0%, 0); }
      .opening-end #information .info-contents {
        transition: all 400ms; } }
  @media (max-width: 768px) {
    .opening-end #information.open {
      top: 0;
      -webkit-transform: translate3d(-50%, 1.5%, 0);
              transform: translate3d(-50%, 1.5%, 0);
      height: 110vh; } }
  @media (min-width: 769px) {
    .opening-end #information.open {
      top: calc(100% + 2px);
      -webkit-transform: translate3d(-50%, -100%, 0);
              transform: translate3d(-50%, -100%, 0); } }
  .opening-end #information.open .title-info .btn-title-info-open {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  @media (min-width: 769px) {
    .opening-end #information.open {
      z-index: 40;
      -webkit-transform: translate3d(-50%, -100%, 0);
              transform: translate3d(-50%, -100%, 0); }
      .opening-end #information.open .info-contents {
        -webkit-transform: translate3d(0%, -100.2%, 0);
                transform: translate3d(0%, -100.2%, 0); } }
  .opening-end #information.hide {
    pointer-events: none;
    opacity: 0;
    -webkit-transform: translate3d(-50%, 0, 0);
            transform: translate3d(-50%, 0, 0); }