@charset "UTF-8";

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

body,
div,
dl,
dt,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
ul,
li,
dl,
dt,
dd,
p,
table,
form,
fieldset,
input,
select,
blockquote,
table,
th,
tr,
td,
address,
iframe {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

img {
  max-width: 100%;
}

html {
  font-size: 10px;
}

* {
  -webkit-touch-callout: none;
}

body {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif;
  line-height: 1.9;
  text-align: center;
  background: #fff;
  color: #c6c6c6;
  max-width: 1000px;
  margin: auto;
  height: 100% !important;
}

.app-con,
.container,
#main {
  height: 100%;
}

#main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  min-height: 100%;
  -webkit-flex-flow: wrap;
      -ms-flex-flow: wrap;
          flex-flow: wrap;
}

.content {
  -webkit-align-self: flex-start;
      -ms-flex-item-align: start;
          align-self: flex-start;
}

p {
  text-align: left;
}

/* a{
	color: inherit;
	display:block;
}
*/

ul {
  list-style-type: none;
  text-align: left;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
  width: 100%;
  height: 0;
}

a img,
a object {
  -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;
}

a:hover img,
a:hover object {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

object {
  pointer-events: none;
}

/*---------------------------------------------------------
	ul,li
----------------------------------------------------------*/

/*---------------------------------------------------------
	kv,logo
----------------------------------------------------------*/

.main_visual img {
  display: block;
}

/*---------------------------------------------------------
	layout
----------------------------------------------------------*/

.gaiyou,
.move,
.how_to,
.cation {
  width: 70%;
}

.btn {
  margin: 2em auto;
  width: 80%;
}

.gaiyou,
.oubo_howto,
.move,
.how_to {
  margin: 5em auto;
}

.how_to img {
  margin: 1.5em 0;
}

.copy {
  width: 100%;
  text-align: justify;
  font-size: 0.289855rem;
  color: #b5b6bb;
  height: 0.483092rem;
  line-height: 0.483092rem;
  -webkit-align-self: flex-end;
      -ms-flex-item-align: end;
          align-self: flex-end;
  margin: 0.536232rem auto 0.563607rem;
  font-family: PingFangSC-Regular;
}

footer p {
  text-align: center;
}

/*---------------------------------------------------------
	button
----------------------------------------------------------*/

.install {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.square_btn {
  width: 8.220612rem;
  height: 1.481481rem;
  background: #d65b50;
  -webkit-border-radius: 0.740741rem;
     -moz-border-radius: 0.740741rem;
          border-radius: 0.740741rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
     -moz-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0.563607rem 0 0.466989rem;
}

.text {
  margin-left: 0.241546rem;
  font-size: 0.466989rem;
  color: #fdfdfdfd;
  font-family: PingFangSC-Medium;
  text-align: left;
}

.btn_img {
  width: 0.885668rem;
  height: 0.885668rem;
  margin: 0;
}

.square_btn_2 {
  width: 7.568438rem;
  height: 1.363929rem;
  background: #f27459;
  -webkit-border-radius: 0.681965rem;
     -moz-border-radius: 0.681965rem;
          border-radius: 0.681965rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
     -moz-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.square_btn_next {
  padding: 7px 48px;
}

@media screen and (max-width: 768px) and (min-width: 321px) {
  /*---------------------------------------------------------
        kv,logo
    ----------------------------------------------------------*/

  .main_logo {
    width: 35%;
    margin: 0 auto;
  }

  .logo {
    width: 100%;
    height: 80px;
  }

  /*---------------------------------------------------------
        layout
    ----------------------------------------------------------*/

  .gaiyou,
  .move,
  .how_to,
  .cation,
  .caiton_text {
    width: 90%;
  }

  .btn {
    margin: 2em auto;
    width: 95%;
  }

  .gaiyou,
  .oubo_howto,
  .move,
  .how_to,
  .caiton_text {
    margin: 1em auto;
  }

  .how_to img {
    margin: 0.5em 0;
  }
}

@media screen and (max-width: 600px) {

}

@media screen and (max-width: 500px) {

}

@media screen and (max-width: 320px) {
  /*---------------------------------------------------------
        kv,logo
    ----------------------------------------------------------*/

  .main_logo {
    width: 35%;
    margin: 0 auto;
  }

  .logo {
    width: 100%;
    height: 65px;
  }
}#content[data-v-421a69e0] {
  width: 100%;
}