@charset "UTF-8";
/* CSS Document */
html {
  overflow-y: scroll;
}

body {
  background: #000;
}

#wrapper {
  background: none;
}

@-webkit-keyframes kaiten {
  0% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}

@keyframes kaiten {
  0% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@-webkit-keyframes scroll_y {
  0% {
    height: 20rem;
  }
  50% {
    height: 16rem;
  }
  100% {
    height: 20rem;
  }
}
@keyframes scroll_y {
  0% {
    height: 20rem;
  }
  50% {
    height: 16rem;
  }
  100% {
    height: 20rem;
  }
}
/***********************************************************************
ミディアムデバイス (スマートフォン) のスタイル
**********************************************************************/
@media (max-width: 750px) {
  #wrapper {
    width: 75rem;
    overflow-x: hidden;
  }
  .bg {
    background: url(../images/data_bg_sp.png) no-repeat center/cover;
    width: 100%;
    height: 272rem;
  }
  #wrapper {
    width: 100%;
    height: 100%;
  }
  .data {
    padding-top: 21rem;
  }
  .data .data_tit {
    background: url(../images/data_tit_sp.png) no-repeat center/cover;
    width: 69.5rem;
    height: 13.3rem;
    margin: 0 auto;
  }
  .data .data_read {
    width: 65rem;
    margin: 0 auto;
  }
  .data .data_read p {
    font-size: 2.7rem;
    text-align: center;
    color: #fff;
  }
  .data .data_tri_wrap {
    background-image: url(../images/data_tri_sp.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
    /* or 100% auto */
    width: 75rem;
    height: 164rem;
    margin: 3rem auto 6rem;
  }
  .data .data_tri_table {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 75rem;
    margin: 0 auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .data .data_table1 {
    background: url(../images/data_table1_sp.png) no-repeat center/cover;
    width: 71.5rem;
    height: 39rem;
    margin-top: 16rem;
  }
  .data .data_table2 {
    background: url(../images/data_table2_sp.png) no-repeat center/cover;
    width: 71.5rem;
    height: 39rem;
    margin-top: 2rem;
  }
  .data .data_table3 {
    background: url(../images/data_table3_sp.png) no-repeat center/cover;
    width: 60rem;
    height: 60.4rem;
    margin-left: 3rem;
    margin-top: 2rem;
  }
  .data .data_table_come {
    margin-left: 4rem;
  }
  .data .data_table_come p {
    font-size: 2.3rem;
    color: #fff;
    width: 66rem;
  }
  .data .data_gran_wrap {
    background: url(../images/data_gran_sp.png) no-repeat top center;
    width: 75rem;
    height: 60rem;
    margin: 0px auto;
    background-size: contain;
    /* or 100% auto */
  }
  .data .data_table4 {
    background: url(../images/data_table4_sp.png) no-repeat center/cover;
    width: 72rem;
    height: 37rem;
    margin: 0 auto;
    top: 15rem;
    right: 1rem;
    position: relative;
  }
}
/***********************************************************************
ラージデバイス (デスクトップ) のスタイル
**********************************************************************/
@media (min-width: 751px) {
  html,
  body {
    width: 192rem;
    height: 100%;
  }
  .bg {
    width: 100%;
    height: 168rem;
    background: url(../images/data_bg_pc.png) no-repeat top/cover;
  }
  #wrapper {
    width: 100%;
    height: 100%;
  }
  .data {
    padding-top: 11rem;
  }
  .data .data_tit {
    background: url(../images/data_tit_pc.png) no-repeat center/cover;
    width: 111.5rem;
    height: 12.3rem;
    margin: 0 auto;
  }
  .data .data_read p {
    font-size: 1.8rem;
    text-align: center;
    color: #fff;
  }
  .data .data_tri_wrap {
    background: url(../images/data_tri_pc.png) no-repeat center/cover;
    width: 141rem;
    height: 64.5rem;
    margin: 3rem auto;
    padding-top: 13rem;
  }
  .data .data_tri_table {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    height: 62rem;
    width: 115rem;
    margin: 0 auto;
  }
  .data .data_table1 {
    background: url(../images/data_table1_pc.png) no-repeat center/cover;
    width: 61rem;
    height: 31rem;
  }
  .data .data_table2 {
    background: url(../images/data_table2_pc.png) no-repeat center/cover;
    width: 61rem;
    height: 31rem;
  }
  .data .data_table3 {
    background: url(../images/data_table3_pc.png) no-repeat center/cover;
    width: 47rem;
    height: 48.4rem;
    margin-left: 4rem;
  }
  .data .data_table_come {
    margin-left: 4rem;
  }
  .data .data_table_come p {
    font-size: 1.6rem;
    color: #fff;
    width: 50rem;
  }
  .data .data_gran_wrap {
    background: url(../images/data_gran_pc.png) no-repeat center/cover;
    width: 141rem;
    height: 38rem;
    margin: 0px auto;
    padding-top: 12rem;
  }
  .data .data_table4 {
    background: url(../images/data_table4_pc.png) no-repeat center/cover;
    width: 97rem;
    height: 32rem;
    margin: 0 auto;
  }
}
/* アニメーション */
@-webkit-keyframes logotape {
  from {
    background-position: 0rem 0rem;
  }
  to {
    background-position: 0rem -32rem;
  }
}
@keyframes logotape {
  from {
    background-position: 0rem 0rem;
  }
  to {
    background-position: 0rem -32rem;
  }
}/*# sourceMappingURL=data.css.map */