/* ****************************************************
mixin
**************************************************** */
/* center */
/* opacity */
/* text length */
/* transition */
/* break point */
/* for Coding */
/* ****************************************************
color set
**************************************************** */
/* ****************************************************
font
**************************************************** */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
/* ****************************************************
basic
**************************************************** */
body {
  overflow: hidden;
  background: -webkit-gradient(linear, left top, right top, from(#54D6D9), color-stop(50%, #54D6D9), color-stop(50%, #fff), to(#fff));
  background: -webkit-linear-gradient(left, #54D6D9 0%, #54D6D9 50%, #fff 50%, #fff 100%);
  background: -o-linear-gradient(left, #54D6D9 0%, #54D6D9 50%, #fff 50%, #fff 100%);
  background: linear-gradient(90deg, #54D6D9 0%, #54D6D9 50%, #fff 50%, #fff 100%);
  font-size: 62.5%;
  line-height: 1.8;
  margin: 0;
  font-family: 'Noto Sans Japanese', sans-serif;
  color: #5CD9FF; }
  body a {
    text-decoration: none;
    -webkit-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
    color: #333; }
    body a:hover {
      opacity: 0.4;
      filter: alpha(opacity=40); }
  body img {
    vertical-align: middle; }

.delay0_5 {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s; }

.delay1 {
  -webkit-animation-delay: 1s;
  animation-delay: 1s; }

.delay1_5 {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s; }
  .delay2 {
    -webkit-animation-delay: 2s;
    animation-delay: 2s; }

/* ****************************************************
contents
**************************************************** */
.wrapper_pc {
  width: 100vw;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }
  .wrapper_pc .contents {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    .wrapper_pc .contents .left_side,
    .wrapper_pc .contents .right_side {
      width: 50%; }
      .wrapper_pc .contents .left_side img,
      .wrapper_pc .contents .right_side img {
        width: 100%; }
    .wrapper_pc .contents .left_side {
      position: relative; }
      .wrapper_pc .contents .left_side p {
        width: 100%;
        padding: 0;
        margin: 0; }
        .wrapper_pc .contents .left_side p.bg {
          text-align: center;
          position: relative;
          top: 50%;
          -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          transform: translateY(-50%); }
        .wrapper_pc .contents .left_side p.logo {
          width: 17.5%;
          position: absolute;
          top: 3.9%;
          left: 19.7%; }
        .wrapper_pc .contents .left_side p.i01 {
          width: 35.3%;
          position: absolute;
          top: 11.5%;
          left: 32.4%;
          opacity: 0; }
        .wrapper_pc .contents .left_side p.i02 {
          width: 35.4%;
          position: absolute;
          top: 21.7%;
          left: 46.3%;
          opacity: 0; }
        .wrapper_pc .contents .left_side p.i03 {
          width: 24.3%;
          position: absolute;
          top: 83.6%;
          left: 39.0%;
          opacity: 0; }
      .wrapper_pc .contents .left_side ul.sns {
        list-style-type: none;
        padding: 0;
        margin: 0;
        width: 27.9%;
        position: absolute;
        top: 4.0%;
        left: 51.5%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between; }
        .wrapper_pc .contents .left_side ul.sns li {
          width: 32%; }
    .wrapper_pc .contents .right_side .swiper-wrapper .swiper-slide p {
      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
      padding: 0;
      margin: 0;
      opacity: 0; }
      .wrapper_pc .contents .right_side .swiper-wrapper .swiper-slide p.bg {
        opacity: 1; }
        .wrapper_pc .contents .right_side .swiper-wrapper .swiper-slide p.bg img {
          width: 100%;
          height: auto; }
      .wrapper_pc .contents .right_side .swiper-wrapper .swiper-slide p img {
        width: 100%; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page2 p.i01 {
      width: 27.2%;
      position: absolute;
      top: 44.5%;
      left: 47.8%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page2 p.i02 {
      width: 24.5%;
      position: absolute;
      top: 54.7%;
      left: 22.7%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page3 p.i01 {
      width: 31.9%;
      position: absolute;
      top: 15.0%;
      left: 25.7%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page3 p.i02 {
      width: 27.8%;
      position: absolute;
      top: 40.3%;
      left: 49.2%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page4 p.i01 {
      width: 30.3%;
      position: absolute;
      top: 14.4%;
      left: 27.0%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page4 p.i02 {
      width: 26.2%;
      position: absolute;
      top: 41.8%;
      left: 25.1%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page5 p.i01 {
      width: 32.6%;
      position: absolute;
      top: 13.7%;
      left: 41.4%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page6 p.i01 {
      width: 42.4%;
      position: absolute;
      top: 76.3%;
      left: 29.4%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page7 p.i01 {
      width: 35.3%;
      position: absolute;
      top: 13.2%;
      left: 26.2%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page7 p.i02 {
      width: 51.0%;
      position: absolute;
      top: 64.5%;
      left: 28.3%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page8 p.i01 {
      width: 32.4%;
      position: absolute;
      top: 16.4%;
      left: 41.3%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page9 p.i01 {
      width: 12.6%;
      position: absolute;
      top: 15.7%;
      left: 24.6%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page9 p.i02 {
      width: 24.3%;
      position: absolute;
      top: 58.3%;
      left: 59.1%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page10 p.i01 {
      width: 44.1%;
      position: absolute;
      top: 7.3%;
      left: 27.1%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page10 p.i02 {
      width: 38.7%;
      position: absolute;
      top: 50.7%;
      left: 30.8%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page10 p.i03 {
      width: 39.7%;
      position: absolute;
      top: 63.2%;
      left: 30.0%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page10 p.logo {
      width: 29.7%;
      position: absolute;
      top: 78.8%;
      left: 31.3%;
      opacity: 1; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page10 p.i04 {
      width: 12.2%;
      position: absolute;
      top: 79.8%;
      left: 63.1%;
      opacity: 0; }
    .wrapper_pc .contents .right_side .swiper-wrapper .page10 ul {
      list-style-type: none;
      padding: 0;
      margin: 0;
      position: absolute;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -ms-flex-wrap: nowrap;
      flex-wrap: nowrap; }
      .wrapper_pc .contents .right_side .swiper-wrapper .page10 ul.sns {
        width: 46.4%;
        top: 68.7%;
        left: 27.4%;
        opacity: 0; }
        .wrapper_pc .contents .right_side .swiper-wrapper .page10 ul.sns li {
          width: 32%; }

.wrapper_sp {
  display: none; }

@media (max-width: 639px) {
  body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: url(../images/pc/common/bg.png); }
    body .wrapper_pc {
      display: none; }
    body .wrapper_sp {
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      body .wrapper_sp .contents {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        position: absolute;
        width: 100%;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
        body .wrapper_sp .contents .swiper-wrapper {
          padding-bottom: 0; }
          body .wrapper_sp .contents .swiper-wrapper .swiper-slide {
            -webkit-box-sizing: border-box;
            box-sizing: border-box; }
            body .wrapper_sp .contents .swiper-wrapper .swiper-slide p {
              width: 95%;
              margin-left: 2.5%; }
              body .wrapper_sp .contents .swiper-wrapper .swiper-slide p img {
                width: 100%; }
          body .wrapper_sp .contents .swiper-wrapper .page1 ul.sns {
            list-style-type: none;
            padding: 0;
            margin: 0;
            width: 47.5%;
            position: absolute;
            top: 5.5%;
            left: 43.7%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between; }
            body .wrapper_sp .contents .swiper-wrapper .page1 ul.sns li {
              width: 32%;
              height: auto; }
              body .wrapper_sp .contents .swiper-wrapper .page1 ul.sns li img {
                width: 100%; }
          body .wrapper_sp .contents .swiper-wrapper .page1 p.logo {
            width: 24.415%;
            position: absolute;
            top: 3.8%;
            left: 5.8%; }
          body .wrapper_sp .contents .swiper-wrapper .page1 p.i01 {
            width: 52.44%;
            position: absolute;
            top: 11.3%;
            left: 21.85%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page1 p.i02 {
            width: 50.445%;
            position: absolute;
            top: 21.7%;
            left: 42.56%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page1 p.i03 {
            width: 34.675%;
            position: absolute;
            top: 81.6%;
            left: 31.825%;
            opacity: 0; }
            body .wrapper_sp .contents .swiper-wrapper .page1 p.i04 {
              width: 28.5%;
              position: absolute;
              top: 40%;
              left: 33.25%;
              opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page2 p.i01 {
            width: 34.01%;
            position: absolute;
            top: 42.7%;
            left: 44.365%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page2 p.i02 {
            width: 34.96%;
            position: absolute;
            top: 53.6%;
            left: 8.835%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page3 p.i01 {
            width: 45.505%;
            position: absolute;
            top: 14.9%;
            left: 11.82275%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page3 p.i02 {
            width: 39.615%;
            position: absolute;
            top: 40.3%;
            left: 46.36%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page4 p.i01 {
            width: 43.13%;
            position: absolute;
            top: 14.4%;
            left: 14.44%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page4 p.i02 {
            width: 37.335%;
            position: absolute;
            top: 41.7%;
            left: 11.875%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page5 p.i01 {
            width: 46.455%;
            position: absolute;
            top: 13.7%;
            left: 35.15%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page6 p.i01 {
            width: 60.325%;
            position: absolute;
            top: 73.3%;
            left: 19%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page7 p.i01 {
            width: 50.255%;
            position: absolute;
            top: 13.2%;
            left: 13.49%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page7 p.i02 {
            width: 72.77%;
            position: absolute;
            top: 62.2%;
            left: 16.435%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page8 p.i01 {
            width: 46.075%;
            position: absolute;
            top: 15.4%;
            left: 35.15%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page9 p.i01 {
            width: 17.955%;
            position: absolute;
            top: 15.2%;
            left: 11.685%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page9 p.i02 {
            width: 34.675%;
            position: absolute;
            top: 56.0%;
            left: 60.23%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page10 p.i01 {
            width: 62.795%;
            position: absolute;
            top: 7.0%;
            left: 15.39%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page10 p.i02 {
            width: 55.1%;
            position: absolute;
            top: 48.7%;
            left: 20.805%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page10 p.i03 {
            width: 56.62%;
            position: absolute;
            top: 60.2%;
            left: 19%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page10 p.logo {
            width: 42.37%;
            position: absolute;
            top: 75.8%;
            left: 19.855%;
            opacity: 1; }
          body .wrapper_sp .contents .swiper-wrapper .page10 p.i04 {
            width: 17.29%;
            position: absolute;
            top: 77.0%;
            left: 69.92%;
            opacity: 0; }
          body .wrapper_sp .contents .swiper-wrapper .page10 ul {
            list-style-type: none;
            padding: 0;
            margin: 0;
            margin-left: 2.5%;
            position: absolute;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap; }
            body .wrapper_sp .contents .swiper-wrapper .page10 ul.sns {
              width: 55.195%;
              top: 67.7%;
              left: 20.805%;
              opacity: 0; }
              body .wrapper_sp .contents .swiper-wrapper .page10 ul.sns li {
                width: 32%; }
                body .wrapper_sp .contents .swiper-wrapper .page10 ul.sns li img {
                  width: 100%; } }

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  display: none !important; }