@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1;
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",YuGothic,Yu Gothic,"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

html {
  font-size: calc(112.5% + 4 * (100vw - 1080px) / 400 ); }

body {
  font-size: 1em; }

.base-container {
  background-color: #f7c847;
  display: flex;
  flex-direction: column; }

.main-visual-container {
  background-image: url("../img/mv_background.png");
  -webkit-background-size: contain;
  background-size: contain;
  display: flex; }

.main-visual-head-container {
  background-color: #fd543d;
  display: flex; }

.app-container {
  background-image: url("../img/app_download_background.png");
  display: flex;
  background-size: contain; }

.footer-container {
  background-color: #000000;
  display: flex;
  padding: 2vw 0; }
  .footer-container .container p {
    text-align: center;
    color: #ffffff; }

.container {
  width: 100%;
  max-width: 960px;
  text-align: center;
  margin: 0 auto;
  line-height: 1.5em; }
  .container p, .container h1, .container h2, .container h3, .container h4, .container li {
    text-align: left; }
  .container h2 {
    margin-top: 4em; }
  .container h3 {
    margin-top: 2em; }
  .container p {
    font-size: 1em;
    margin-top: 2%;
    margin-bottom: 2%; }
  .container img {
    width: 100%;
    max-width: 100%;
    object-fit: contain; }
  .container .content {
    margin: 0 1vw; }
    .container .content img {
      height: auto;
      width: 100%;
      margin: 4.7vw 0; }
    .container .content .wrapper {
      padding: 2.3vw;
      margin-bottom: 4vw;
      background-color: #ffffff;
      -webkit-border-radius: 2.3vw;
      -moz-border-radius: 2.3vw;
      border-radius: 2.3vw; }
      .container .content .wrapper img {
        margin: 0; }
    .container .content .divider {
      height: 9.5%;
      object-fit: contain;
      margin: 1vw 0; }
      .container .content .divider img {
        margin: 1vw 0;
        height: 9.5vw; }
  .container .head {
    width: 100%;
    margin: 11.5% auto 0; }
    .container .head img {
      max-height: 128px;
      height: 11.8vw; }
  .container .flex-container-row {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap; }
    .container .flex-container-row .flex-item {
      margin: 1%; }
      .container .flex-container-row .flex-item img {
        display: block;
        margin: 0; }
      .container .flex-container-row .flex-item p {
        margin-top: 4%;
        text-align: center;
        font-size: 1.4em; }
  .container .flex-container-2col {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin: 11.5% auto 0; }
    .container .flex-container-2col .flex-item {
      margin: 1%;
      flex-basis: 48%; }
      .container .flex-container-2col .flex-item img {
        display: block;
        margin: 0; }
      .container .flex-container-2col .flex-item p {
        margin-top: 4%;
        text-align: center;
        font-size: 1.4em; }
  .container strong {
    font-size: 1.2em; }
  .container ul {
    margin-top: 2vw; }
  .container li {
    line-height: 2em; }
  .container .app-image {
    margin: 1%; }
  .container .app-title {
    color: #ffffff;
    font-size: 1.2em;
    text-align: center;
    margin: 4% 1%;
    font-weight: bold; }
  .container .app-copy {
    color: #ffffff;
    font-size: 1.6em;
    text-align: center;
    font-weight: bold;
    margin: 4% 1%; }
  .container .app-summary {
    color: #ffffff;
    font-size: 1em;
    text-align: center;
    margin: 8% 1%; }
  .container .app-download {
    margin: 4%; }

@media screen and (max-width: 750px) {
  .main-visual-container .container {
    width: 92%; }

  .container .head {
    width: 92%; }
  .container .content {
    margin: 0 4vw; } }

/*# sourceMappingURL=main.css.map */