@charset "UTF-8";
/* ****************************************************
mixin
**************************************************** */
/* ****************************************************
basic
**************************************************** */
html {
  padding: 0;
  margin: 0;
  font-size: 62.5%;
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: subpixel-antialiased; }

body {
  padding: 0;
  margin: 0;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1;
  background: #fff;
  text-align: center;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, "メイリオ", "FontAwesome", serif, Verdana, sans-serif;
  color: #333; }
  body a {
    text-decoration: none;
    -webkit-transition: 0.3s ease-in-out;
    -moz-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=60); }
  body p {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.55556; }
  body img {
    vertical-align: bottom; }
  body .br:before {
    content: "\a";
    white-space: pre; }

/* ****************************************************
header
**************************************************** */
header {
  margin-bottom: 10rem; }
  header h1 {
    transition: 0.4s; }
    header h1.h1-mv {
      opacity: 0;
      transform: translate(0, -800px);
      -webkit-transform: translate(0, -800px); }
    header h1.mv {
      opacity: 1.0;
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0); }
    header h1 img {
      margin: 14rem auto 28rem auto; }
  header p {
    width: 100%;
    transition: 1s; }
    header p.text-mv {
      opacity: 0;
      transform: translate(0, 120px);
      -webkit-transform: translate(0, 120px); }
    header p.mv {
      opacity: 1.0;
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0); }
    header p img {
      width: 100%; }
  header.sp {
    display: none; }

@media only screen and (max-width: 728px) {
  header {
    margin-bottom: 0; }
    header h1 {
      width: 80%;
      margin: 2rem auto 5rem auto;
      transition: 0.2s; }
      header h1.h1-mv {
        opacity: 0;
        transform: translate(0, -400px);
        -webkit-transform: translate(0, -400px); }
      header h1.mv {
        opacity: 1.0;
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0); }
      header h1 img {
        width: 100%;
        margin: 0; } }
/* ****************************************************
main
**************************************************** */
main {
  width: 100%;
  text-align: center; }
  main section {
    width: 100%;
    margin-bottom: 10rem;
    transition: 1s; }
    main section.text-mv {
      opacity: 0;
      transform: translate(0, 120px);
      -webkit-transform: translate(0, 120px); }
    main section.mv {
      opacity: 1.0;
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0); }
    main section img {
      width: 100%; }
    main section .inner {
      width: 968px;
      margin: 0 auto; }
      main section .inner p {
        width: 100%; }
        main section .inner p img {
          width: 100%; }
        main section .inner p.txt {
          width: 800px;
          margin: 5rem auto 6rem auto;
          padding: 4rem 0;
          text-align: left;
          font-size: 17px;
          font-size: 1.7rem;
          line-height: 2.11765; }
    main section.s01 p.chart {
      margin-top: 7rem; }
      main section.s01 p.chart img {
        width: 80%; }
    main section.s02 {
      margin-bottom: 0; }
    main section.s03 {
      background: #f8f6ef;
      margin-bottom: 0;
      padding: 10rem 0; }
      main section.s03 p.chart {
        margin-top: 7rem; }
    main section.sns .inner {
      display: -webkit-box;
      display: -webkit-flexbox;
      display: -webkit-flex;
      display: -moz-flexbox;
      display: -ms-flexbox;
      display: -o-flexbox;
      display: flexbox;
      display: flex;
      -webkit-justify-content: space-between;
      -ms-flex-pack: space-between;
      justify-content: space-between; }
      main section.sns .inner p {
        width: 48%; }
        main section.sns .inner p img {
          width: 100%; }
  main .button {
    margin-bottom: 10rem; }
  main.sp {
    display: none; }

@media only screen and (max-width: 728px) {
  main section .inner {
    transition: 1s;
    width: 100%; }
    main section .inner.text-mv {
      opacity: 0;
      transform: translate(0, 120px);
      -webkit-transform: translate(0, 120px); }
    main section .inner.mv {
      opacity: 1.0;
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0); }
    main section .inner p.txt {
      width: 90%;
      margin: 0 auto;
      text-align: left; }
    main section .inner p.chart1 {
      width: 60%;
      margin: 5rem auto 0 auto; }
      main section .inner p.chart1 img {
        width: 100%; }
    main section .inner p.chart2 {
      width: 80%;
      margin: 5rem auto 0 auto; }
      main section .inner p.chart2 img {
        width: 100%; }
  main section.s01 {
    margin-bottom: 2rem; }
  main section.s03 {
    padding: 0; }
    main section.s03 p {
      transition: 1s; }
      main section.s03 p.text-mv {
        opacity: 0;
        transform: translate(0, 120px);
        -webkit-transform: translate(0, 120px); }
      main section.s03 p.mv {
        opacity: 1.0;
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0); }
      main section.s03 p.txt {
        padding-bottom: 0; }
  main section.s04 p {
    transition: 1s; }
    main section.s04 p.text-mv {
      opacity: 0;
      transform: translate(0, 120px);
      -webkit-transform: translate(0, 120px); }
    main section.s04 p.mv {
      opacity: 1.0;
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0); }
    main section.s04 p.txt {
      padding-bottom: 0; }
  main section.s05 .inner {
    width: 90%; }
  main section.sns .inner {
    width: 90%; }
    main section.sns .inner p {
      width: 32%; } }
/* ****************************************************
footer
**************************************************** */
footer p {
  padding-bottom: 30rem;
  transition: 1s; }
  footer p.text-mv {
    opacity: 0;
    transform: translate(0, 120px);
    -webkit-transform: translate(0, 120px); }
  footer p.mv {
    opacity: 1.0;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0); }
  footer p.sp {
    display: none; }

@media only screen and (max-width: 728px) {
  footer p {
    width: 60%;
    margin: 0 auto;
    padding-bottom: 10rem; }
    footer p img {
      width: 100%; }
    footer p.pc {
      display: none; }
    footer p.sp {
      display: block; } }
@media only screen and (max-width: 728px) {
  header.pc, main.pc, footer.pc {
    display: none; }
  header.sp, main.sp, footer.sp {
    display: block; } }